我正在嘗試使用Highcharts儀表。有沒有辦法將繪圖區設置爲線性漸變?如果我的標尺值爲0-100,我希望繪圖帶從0處的紅色變爲50處的黃色變爲100處的綠色。帶有梯度情節帶的高圖儀表
我以爲我可以爲每個停止點生成獨立的plotband部分,1-100,但是如果有一種方法可以設置一個更清潔的線性外圍設備。任何人都知道一種方式?
我正在嘗試使用Highcharts儀表。有沒有辦法將繪圖區設置爲線性漸變?如果我的標尺值爲0-100,我希望繪圖帶從0處的紅色變爲50處的黃色變爲100處的綠色。帶有梯度情節帶的高圖儀表
我以爲我可以爲每個停止點生成獨立的plotband部分,1-100,但是如果有一種方法可以設置一個更清潔的線性外圍設備。任何人都知道一種方式?
是的,這是可能的。嘗試是這樣的:
yAxis: {
min: 0,
max: 100,
plotBands: [{
color: {
linearGradient: [300, 300, 0, 0],
stops: [
[0, 'rgb(255, 255, 255)'],
[1, 'rgb(150, 200, 155)']
]
},
from: 0,
to: 100
}],
},
通過仔細艇員選拔你的顏色,linearGradients和/把,你應該能夠數plotbands相結合,做你想做的。
上
http://www.highcharts.com/docs/chart-design-and-style/colors
實施例讀出的 「線性漸變」:從黃色到綠色到紅色:
plotBands: [{
from: 0,
to: 29,
color: '#DDDF0D' // yellow
},{
from: 29,
to: 40,
color: {
linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
stops: [
[0, '#55BF3B'], //green
[1, '#DDDF0D'] //yellow
]
}
}, {
from: 40,
to: 51,
color: {
linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
stops: [
[0, '#55BF3B'], //green
[1, '#DF5353'] //red
]
}
}, {
from: 51,
to: 80,
color: '#DF5353' //red
}]