如何动态更改Highcharts（特定的HighMaps）的背景颜色？

当用户在页面中选择一个主题时，高图的backgroundcolor也应根据用户选择而改变。我的代码：如何动态更改Highcharts（特定的HighMaps）的背景颜色？

var colorCode="#fff"; 



var chart1=new Highcharts.mapChart('geoMap', { 
chart: { 

    backgroundColor:colorCode, 
    type: 'map' 


}, 
title: { 
    text: 'US' 
}, 

legend: { 
    enabled: true 
}, 
...... 
...... 
...... 
$('#theme1').click(function() { 
    // colorCode="default" 
    colorCode={ 
       linearGradient: [0, 0, 500, 500], 
       stops: [ 
       [0, 'rgb(142, 158, 171)'], 
       [1, 'rgb(238, 242, 243)'] 
       ] 
      } 

chart1.redraw(); 
});

但图表是没有得到刷新，所以没有得到应用的ColorCode。任何类型的建议都会有所帮助。

来源

2017-03-27 User12_24_4004

你能否给我div的'ID'或'CLASS'这是举行高图 –

您需要实际分配新的颜色图表选项

chart1.options.chart.backgroundColor = colorCode

我做了一个小提琴，是以颜色从下拉菜单（这会效仿你的用户不断变化的主题），并将其设置为你的背景图http://jsfiddle.net/grLrmxhd/1/

来源

2017-03-27 14:12:55

除了你的答案，还可以使用chart.update（）方法动态地改变图表选项。我已经准备了一个使用chart.update更改图表背景颜色的示例。更新：http://jsfiddle.net/grLrmxhd/2/ –

非常感谢你。它的工作，感谢很多。 –

如何动态更改Highcharts（特定的HighMaps）的背景颜色？

回答

相关问题