【echarts】速度三连仪表盘

背景

展示加速度，速度，角速度等瞬时信息，仪表盘组合，echarts给的demo中没有现成的，还是需要改一下配置的。

效果

代码

主要看个配置

 var option2 = {
        tooltip: {
          formatter: '{a} <br/>{b} : {c}%'
        },
        animation: false,
        series: [
          {
            center: ['24%', '35%'],
            radius: '70%',
            type: 'gauge',
            startAngle: -120,
            endAngle: -345,
            min: -10,
            max: 10,
            splitNumber: 10,
            z: 2,
            title: {
              offsetCenter: [0, '-30%'],
              fontSize: 16
            },
            detail: {
              valueAnimation: false,
              formatter: '{value} 弧度/s²',
              fontSize: 18
            },
            data: [
              {
                value: Math.round(this.angularAcc * 100) / 100,
                name: '角速度加速度'
              }
            ]
          },
          {
            center: ['50%', '65%'],
            min: 0,
            max: 60,
            splitNumber: 12,
            z: 1,
            type: 'gauge',
            title: {
              offsetCenter: [0, '-30%'],
              fontSize: 16
            },
            progress: {
              show: true
            },
            detail: {
              valueAnimation: false,
              formatter: '{value} km/h',
              fontSize: 20
            },
            data: [
              {
                value: Math.round(this.speedCur * 100) / 100,
                name: '瞬时速度'
              }
            ]
          },
          {
            center: ['76%', '35%'],
            radius: '70%',
            type: 'gauge',
            startAngle: 165,
            endAngle: -60,
            min: -20,
            max: 30,
            splitNumber: 5,
            z: 3,
            title: {
              offsetCenter: [0, '-30%'],
              fontSize: 16
            },
            detail: {
              formatter: '{value} m/s²',
              fontSize: 18
            },
            data: [
              {
                value: Math.round(this.acc * 100) / 100,
                name: '加速度'
              }
            ]
          }
        ]
      }