$(function () {
var gaugeOptions = {
chart: {
type: 'solidgauge'
},
title: null,
pane: {
center: ['50%', '85%'],
size: '140%',
startAngle: -90,
endAngle: 90,
background: {
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || '#EEE',
innerRadius: '60%',
outerRadius: '100%',
shape: 'arc'
}
},
tooltip: {
enabled: false
},
// the value axis
yAxis: {
lineWidth: 0,
minorTickInterval: null,
tickPixelInterval: 400,
tickWidth: 0,
title: {
y: -70
},
labels: {
y: 16
}
},
plotOptions: {
solidgauge: {
dataLabels: {
y: 5,
borderWidth: 0,
useHTML: true
}
}
}
};
// The speed gauge
$('#container-speed').highcharts(Highcharts.merge(gaugeOptions, {
yAxis: {
min: 0,
max: 100,
title: {
text: 'Speed'
}
},
series: [{
name: 'Speed',
data: [75]
}]
}));
});
使用Highchart的solidgauge。有没有办法让渐变色达到仪表上显示的值?
例如,如果我的仪表从0到100,并且在特定时间我们显示的值是75,我想将其显示为从绿色左侧部分过渡到小型红色右侧部分的渐变颜色。当然,本例中剩余的25%的仪表不应该只显示仪表的背景颜色。
有办法吗?