echarts 仪表盘自定义指针颜色
var myChart = echarts.init(document.getElementById('main2'));
var option = {
tooltip: {
formatter: '{a} <br/>{b} : {c}'
},
title: {
text: '日用电CO2排放总量,ton\n黄色目标值，蓝色实际值',
show: true,
x: 'center', //水平安放位置，默认为'left'，可选为：'center' | 'left' | 'right' | {number}（x坐标，单位px）
y: 'bottom', //
padding: [0, 0, 0, 0],
textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
color: '#FFFFFF',
fontSize: 'calc(100vh *14 / 1080)',
}
},
series: [
{
name: '业务指标',
type: 'gauge',
min: 0,
max: (this.stysum * 0.766 / 1000.00).toFixed(2),
axisLine: {
lineStyle: {
width: 20,
color: [[0.2, 'rgb(0,198,136)'], [1, 'rgb(46,139,200)']]
}
},
splitNumber: 1,
axisLabel: {
show: true,
distance: -65,
textStyle: { // 属性lineStyle控制线条样式
// fontWeight: 'bolder',
color: 'yellow',
shadowColor: 'rgb(46, 139, 200)', //默认透明
shadowBlur: 5
}
},
axisTick: { // 坐标轴小标记
show: false
},
splitLine: {
length: 44,
lineStyle: {
color: 'auto',
width: 0
}
},
detail: {
formatter: '{value}',
offsetCenter: ["0", "70%"],
textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
color: 'rgb(46,139,200)',
// fontWeight: 'bolder'
fontSize: 'calc(100vh *30 / 1080)'
}
},
radius: "95%",
data: [{ value: (this.lfl1 * 0.766 / 1000.00).toFixed(2), name: '' ,itemStyle:{color:‘red’}}]//修改指针颜色
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option, true);
window.addEventListener("resize", () => {
myChart.resize();
});
原文地址：https://blog.csdn.net/lfl18326162160/article/details/135932222
免责声明：本站文章内容转载自网络资源，如侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！