Echart 仪表盘 样式调整

6 篇文章 0 订阅

option5 = {
    series: [{
        type: 'gauge',
        progress: {
            show: true,
            width: 2
        },
        axisLine: {
            lineStyle: {
                width: 4,//圆弧部分 线宽
              
            }
        },
        axisTick: {
            show: false
        },
        radius: "95%",//圆弧半径,可以使用百分比
        center: ["50%","55%"],//圆形相对容器的坐标 位置
        splitLine: {
            length: 3,  //仪表盘 刻度长  单位像素
            lineStyle: {
                width: 2,//仪表盘 刻度线  线宽
                color: '#ffffff'//仪表盘 刻度线  颜色
            }
        },
        pointer: {
            icon: 'path://M12.8,0.7l12,40.1H0.7L12.8,0.7z',//仪表盘 指针 样式
            width: 2,///仪表盘 指针 针宽度
            offsetCenter: [0, '-60%'],
           
        },
        axisLabel: {
            distance: 3,//仪表盘 刻度 度数信息  离圆弧 距离
            color: '#ffffff',
            fontSize: 6 //仪表盘 刻度 度数信息 字体大小
        },
        anchor: {
            show: false,
            showAbove: true,
            size: 10,
            itemStyle: {
                borderWidth: 10
            }
        },
        title: {
            show: false
        },
        min: 0,  //仪表盘 起始刻度值
        max: 240, //仪表盘 结束刻度值
        detail: {
            valueAnimation: true,
            fontSize: 10,   //圆心处 描述文字  字号
            color: '#ffffff', //圆心处 描述文字  颜色
            formatter: function (value) {//圆心处 描述文字 格式 
                return value.toFixed(0) + '个\n稳控退出';
            },
        },
        data: [{
            value: 50  //实际值  指向位置
        }]
    }]
};

 

 

 

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

悟●禅●酒

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值