当前位置:首页 > 编程笔记 > 正文
已解决

仪表盘自定义标题和数值样式

来自网友在路上 173873提问 提问时间:2023-10-24 19:22:00阅读次数: 73

最佳答案 问答题库738位专家为你答疑解惑

仪表盘自定义标题和数值样式


在这里插入图片描述

fn()
var myEcharts;
function fn(v) {var chartDom = document.getElementById('myEcharts');myEcharts&& myEcharts.dispose();myEcharts= echarts.init(chartDom, 'walden');var option;option = {series: [{type: 'gauge',radius: '85%',center: ['50%', '45%'],max: 1,axisLine: {lineStyle: {width: 5,color: [[0.3, '#00a2ff'],[0.7, '#00e9fb'],[1, '#00a2ff']]}},pointer: {itemStyle: {color: 'auto'}},axisTick: {distance: 0,length: 3,lineStyle: {color: 'auto',width: 2}},splitLine: {show: true,distance: 0,length: 8,lineStyle: {color: 'transparent',width: 0,// type: "dashed"},},axisLabel: {color: 'auto',distance: 0,fontSize: 10},detail: {valueAnimation: true,formatter: '{title|累计用电}' +'\n' +'{value|{value}}',// color: '#666666', //或者放开这里注释的两行,将{value|{value}}=》{value} 也可// fontSize: 23,offsetCenter: [0, '70%'],rich: { //特定样式title: {fontSize: 16,fontWeight: 'bolder',color:"#666666",},value: {fontSize: 23, fontWeight: 'bolder',color: '#666666',},},},data: [{value: 3034467.56,}]}]};option && myEcharts.setOption(option);//图表自适应window.addEventListener("resize", function (event) {myEcharts.resize();})}
查看全文

99%的人还看了

猜你感兴趣

版权申明

本文"仪表盘自定义标题和数值样式":http://eshow365.cn/6-23555-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!