是否可以改变highcharts的背景颜色?

时间:2013-03-15 10:08:12

标签: highcharts

考虑以下情况:

    chart.options.chart.backgroundColor= {
        linearGradient: [0, 0, 0, 400],
        stops: [ [0, 'rgb(96, 96, 96)'], 
        [1, 'rgb(16, 16, 16)'] ]
    };
    chart.redraw():

一切都在这里:http://jsfiddle.net/S8f86/3/

是否可以使用事件更改图表的背景颜色?

2 个答案:

答案 0 :(得分:5)

Highcharts没有API调用来执行此操作。但是,您可以获取基础元素并将一些CSS样式应用于它们。 e.g。

chart.chartBackground.css(
        {
            color: '#555555',
        });

http://jsfiddle.net/xzUcC/

当您直接操作dom时,无需在图表上调用redraw()。

正如另一张海报所提到的,你可以按如下方式做毕业背景:

 var gradient = {
        linearGradient: [0, 0, 0, 400],
                 stops: [ [0, 'rgb(96, 96, 96)'], 
                          [1, 'rgb(16, 16, 16)'] ]
        };
        chart.chartBackground.attr({
                 fill:gradient
        });

答案 1 :(得分:5)

您可以使用图表渲染器和svg属性。

http://jsfiddle.net/S8f86/4/

this.renderer.button('Change background color', 74, 30, function(){

                        var gradient = {
                            linearGradient: [0, 0, 0, 400],
                            stops: [ [0, 'rgb(96, 96, 96)'], 
                                     [1, 'rgb(16, 16, 16)'] ]
                        };

                    chart.chartBackground.attr({
                        fill:gradient
                    });

                    }).add();