highcharts仪表盘

待风起云散

于 2021-04-26 17:45:11 发布

阅读量310

点赞数

分类专栏：学习笔记文章标签：前端

本文链接：https://blog.csdn.net/zhaoxq1223/article/details/116164757

版权

学习笔记专栏收录该内容

4 篇文章 0 订阅

订阅专栏

highcharts仪表盘的配置项

  gaugeOption: {
        chart: {
          type: "gauge",
          spacing: [30, 0, 0, 0],
        },
        credits: {
          enabled: false,
        },
        title: {
          text: "设备故障率( % )",
          verticalAlign: "bottom",
          style: {
            color: "#666666",
            fontSize: "24rpx",
            fontWeight: "bolder",
          },
          y: 0,
        },
        pane: {
          startAngle: -150,
          endAngle: 150,
          background: [],
        },
        plotOptions: {
          gauge: {
            dial: {
              //仪表盘指针
              radius: "70%",
              backgroundColor: "#a1d7ed",
            },
          },
        },
        yAxis: {
          min: 0,
          max: 100,
          tickPixelInterval: null,
          offset: 0,
          labels: {
            enabled: false,
          },
          plotBands: [
            {
              from: 0,
              to: 33,
              color: "#a5d4eb",
            },
            {
              from: 33,
              to: 68,
              color: "#5db7df",
            },
            {
              from: 68,
              to: 100,
              color: "#1e9bd3",
            },
          ],
        },
        series: [
          {
           	data: [],
            name: "设备故障率",
            tooltip: {
              valueSuffix: "%",
            },
          },
        ],
      },