2013-12-22 269 views
8

我真的不知道该怎么做。更改HighCharts背景颜色?

我需要改变背景颜色的这个highcharts图表:

http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/polar-spider/

但我似乎并没有能够做到这一点 - 似乎没有要放任何明确的地方背景颜色设置?

我试图在本节写了许多不同的值:

图表:{

 polar: true, 
     type: 'line' 

    }, 

但它没有做任何事情(偶尔打破了这个脚本)。

我是否需要在包含的.js文件中的某处更改它?或者可以从这个加载的脚本的级别完成?

JS真的很混乱。谁能帮我?

+0

整个图表的六边形内的背景,或只是部分价值? – DBS

回答

21

看看在Highcharts API这里:http://api.highcharts.com/highcharts#chart--backgroundColor,你会看到它的,可以采取纯色图表对象的属性:

{ 
    chart: { 
    backgroundColor: '#FCFFC5', 
    polar: true, 
    type: 'line' 
    } 
} 

或者Gradiant:

{ 
    chart: { 
    backgroundColor: { 
     linearGradient: [0, 0, 500, 500], 
     stops: [ 
     [0, 'rgb(255, 255, 255)'], 
     [1, 'rgb(200, 200, 255)'] 
     ] 
    }, 
    polar: true, 
    type: 'line' 
    } 
} 
+0

谢谢,像一个魅力工作! – user3010273

+0

我试过这两个饼图但始终出现在svg,重写设置:'' –

2

有是的backgroundColor标签可以使用:(http://jsfiddle.net/aeP4E/

chart: { 
     polar: true, 
     type: 'line', 
     backgroundColor:'blue' 
}, 
1

这就是你想要 `

chart: { 
      polar: true, 
      type: 'line', 
      backgroundColor:'rgba(255, 255, 255, 0.1)' 
     } 

`

0

Demo

您可以data: [[0, 0, true],您可以通过 'false' 隐藏价值,你可以设置你的梯度 通过

colorAxis: { 
     min: 0, 
     stops: [ 
     [0, '#5DBA76'], 
     [0.4, '#ffff00'], 
     [0.8, '#F30000'] 
    ], 
     minColor: '#ff0000', 
     maxColor: '#ffff00' 
    }, 

谢谢:)

0

你可以隐藏“假”

data: [[0, 0, false], [0, 1, 2], [0, 2, 3], [0, 3, 4], [0, 4, 5], [1, 0, 2], [1, 1, 4], [1, 2, 6], [1, 3, 8], [1, 4, 10], [2, 0, 3], [2, 1, 6], [2, 2, 9], [2, 3, 12], [2, 4, 15], [3, 0, 4], [3, 1, 8], [3, 2,12], [3, 3, 16], [3, 4, 20], [4, 0, 5], [4, 1, 10], [4, 2, 15], [4, 3, 20], [4, 4, 25] 

http://jsfiddle.net/3527r4ty/1/

+0

请问你能详细解释一下你的答案吗? – abarisone