Cambiar un tema de Highcharts (parcialmente activo)

Question

Tengo un problema con el cambio del tema para los Highcharts. He creado una matriz para contener todos los temas y estoy tratando de cambiarlos a través de una lista de selección en el evento Cambio.

var highcharts_theme = []; 

/* Default theme */ 
highcharts_theme.push({}); 

/* Dark Blue theme */ 
highcharts_theme.push({ 
    colors: ["#DDDF0D", "#55BF3B", "#DF5353", "#7798BF", "#aaeeee", "#ff0066", "#eeaaee", 
     "#55BF3B", "#DF5353", "#7798BF", "#aaeeee"], 
    chart: { 
     backgroundColor: { 
      linearGradient: [0, 0, 250, 500], 
      stops: [ 
       [0, 'rgb(48, 48, 96)'], 
       [1, 'rgb(0, 0, 0)'] 
      ] 
     }, 
.... Shortened for brevity..... 

Mi código para cambiar el tema es:

$('#theme-type').selectmenu({ width: 200 }).change(function (e) { 
     var themeIndex = parseInt($('#theme-type').val()); 
     Highcharts.theme = highcharts_theme[themeIndex]; 
     // Apply the theme 
     highchartsOptions = Highcharts.setOptions(Highcharts.theme); 
    }); 

El problema que estoy teniendo es que si, por ejemplo, me cambio a la temática cielos, está muy bien, pero luego cambiar a cualquier otro tema, el fondo del cielo permanece junto con otros elementos del tema.

¿Alguien sabe de una forma adecuada de restablecer el tema por completo?

Gracias

Answer 1

Cada vez que se establece un tema, que se funde con el tema existente, y por lo tanto cualquier opción que no está presente en el nuevo tema que va a elegir el tema existente. Esto puede no ser deseado siempre.

Desafortunadamente, Highcharts no ofrece la opción de volver a los valores predeterminados establecidos en el momento de la primera carga. El código siguiente se puede utilizar para conseguir que la funcionalidad

// Make a copy of the defaults, call this line before any other setOptions call 
var HCDefaults = $.extend(true, {}, Highcharts.getOptions(), {}); 

function ResetOptions() { 
    // Fortunately, Highcharts returns the reference to defaultOptions itself 
    // We can manipulate this and delete all the properties 
    var defaultOptions = Highcharts.getOptions(); 
    for (var prop in defaultOptions) { 
     if (typeof defaultOptions[prop] !== 'function') delete defaultOptions[prop]; 
    } 
    // Fall back to the defaults that we captured initially, this resets the theme 
    Highcharts.setOptions(HCDefaults); 
} 

Después de restablecer el tema, mediante un nuevo diseño que funcionaría como si ese es el primer tema que se aplica.

Demo @ jsFiddle

Answer 2

Si elimina todas las opciones de color y volver a cargar las Highcharts objeto será por defecto de nuevo al tema de fondo por defecto. Si configura el siguiente valor nulo, no debería mostrar una imagen de fondo una vez recargado.

plotBackgroundImage: null