Echarts在线免费图表

 
            option = {
   backgroundColor: 'rgba(0, 0, 0)', //背景颜色
   // grid: { // 让图表占满容器
   //     x: "10%",//x 偏移量
   //     y: "15%", // y 偏移量
   //     width: "82%", // 宽度
   //     height: "65%"// 高度
   // },

   tooltip: {
      formatter: '{a} <br/>{b} : {c}%'
   },
   series: [{
      type: 'gauge',
      pointer: {
         show: false, //是否显示指针
      },
      progress: {
         show: true,
         roundCap: true,
         width: 20,
      },
      min: 0,
      max: 300,
      itemStyle: {
         color: '',
      },
      // 外部小圈
      axisLine: {
         roundCap: true,
         lineStyle: {
            color: [
               [1, '#8B8B9B']
            ],
            width: 20,
         },
      },
      splitLine: {
         show: false, //是否显示分隔线。
      },
      clockwise: true, //仪表盘刻度是否是顺时针增长。
      axisTick: {
         show: false //是否显示刻度
      },
      splitNumber: 1, //分割线之间的刻度
      // 起始点和最终点距离设置
      axisLabel: {
         show: true,
         distance: -30,
         color: '#fff',
      },
      detail: {
         // 仪表盘文字。
         formatter: function (value) {
            if (value !== 0) {
               var num = Math.round(value);
               return parseInt(num).toFixed(0) + "V";
            } else {
               return 0;
            }
         },
         color: '#fff',
         fontSize: 20,
         // show : false // title下面的文字（53）
      },
      title: {
         // 仪表盘标题。
         show: true,
         offsetCenter: [0, '20%'], // title圆环中心的距离
         fontSize: 30,
         color: '#fff',
      },
      data: [{
         value: 224,
         name: '电压',
      },],
   },],
}