ercharts 仪表盘

最新推荐文章于 2021-10-19 14:13:33 发布

手持两把锟金拷

最新推荐文章于 2021-10-19 14:13:33 发布

阅读量236

点赞数 2

分类专栏：前端

本文链接：https://blog.csdn.net/hlx156/article/details/82691455

版权

前端专栏收录该内容

7 篇文章 0 订阅

订阅专栏

        var c8 = echarts.init(document.querySelector('#c8'));
        c8.setOption({

       tooltip : {
       formatter: "{a} <br/>{c} {b}"
       },
       toolbox: {
       show : true,
       feature : {
       mark : {show: true},
       restore : {show: true},
       saveAsImage : {show: true}
       }
       },

       series : [
       {
       name:'电流',
       type:'gauge',
       min:0,
       max:100,
       splitNumber:10,
       axisLine: { // 坐标轴线
       lineStyle: { // 属性lineStyle控制线条样式
       color: [[1, '#0374d4']],
       width: 3,
       shadowColor : '#0374d4', //默认透明
       shadowBlur: 10
       }
       },
       axisLabel: { // 坐标轴小标记
       textStyle: { // 属性lineStyle控制线条样式
       fontWeight: 'bolder',
       color: '#e9eaeb',
       shadowColor : '#0374d4', //默认透明
       shadowBlur: 15
       }
       },
       axisTick: { // 坐标轴小标记
       length :15, // 属性length控制线长
       lineStyle: { // 属性lineStyle控制线条样式
       color: 'auto',
       shadowColor : '#0374d4', //默认透明
       shadowBlur: 10
       }
       },
       splitLine: { // 分隔线
       length :10, // 属性length控制线长
       lineStyle: { // 属性lineStyle（详见lineStyle）控制线条样式
       width:1,
       color: '#0374d4',
       shadowColor : '#0374d4', //默认透明
       shadowBlur: 1
       }
       },
       pointer: { // 指针
           width:5,
       shadowColor : '#fff', //默认透明
       shadowBlur: 5
       },
       title : {
       textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
       fontWeight: 'bolder',
       fontSize: 12,
       fontStyle: 'italic',
       color: '#fff',
       shadowColor : '#fff', //默认透明
       shadowBlur: 10
       }
       },
       detail : {
       show : true,
           borderWidth: 0,
           borderColor: '#ccc',
           offsetCenter: [0, '40%'], // x, y，单位px
           formatter:'{value}%',
           textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
           fontSize : 50
           }
       },
       data:[{value: 40}]
       },
       ]
       });