• 白色指针分段颜色仪表盘


    <template>
      <div class="tu" id="dashBoard"></div>
    </template>
    
    
    <script>
    export default {
      name: "dashBoard",
      components: {},
      data() {
        return { 
          datas: 0,
        };
      },
      props: ["data"],
      watch: {
        data(n, o) {
          this.datas = n;
          this.drawLine();
        },
      },
      created() {},
      mounted() {
        this.drawLine();
        console.log(this.datas, "11111111111111111111111");
      },
      methods: {
        WidthAdaptive(res) {
          var windth = window.innerWidth;
          let fontSize = windth / 7296;
          return fontSize * res;
        },
        drawLine() {
          let num = this.datas * 100;
          // 基于准备好的dom,初始化echarts实例
          let myChart = this.$echarts.init(document.getElementById("dashBoard"));
          let option = {
            backgroundColor: "transparent",
            grid: {
              right: "5%",
              left: "5%",
              top: "10%",
              bottom: "5%",
              borderWidth: 1,
            },
            xAxis: {
              show: false,
              type: "category",
              data: ["Mon"],
            },
            yAxis: {
              show: false,
              type: "value",
            },
            graphic: {
              elements: [
                {
                  type: "image",
                  z: 4,
                  style: {
                    image:
                      "data:image/png;base64,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",
                     this.WidthAdaptive(280),
                    height: this.WidthAdaptive(160),
                  },
                  left: "center",
                  top: "50%",
                  silent: true,
                },
              ],
            },
            series: [
              {
                name: "任务完成率",
                type: "gauge",
                center: ["50%", "70%"],
                radius: "65%",
                min: 0,
                max: 100,
                splitNumber: 5,
                startAngle: 180,
                endAngle: 0,
                zlevel: 0,
                z: 9,
                data: [
                  {
                    value: num,
                    name: "压力(Pa)",
                    itemStyle: {
                      color: "#fff",
                    },
                  },
                ],
                detail: {
                  formatter: function (params) {
                    return "设备在线率";
                  },
                  fontSize: this.WidthAdaptive(50),
                  color: "#ccc",
                },
                legend: {
                  padding: 0,
                  margin: 0,
                },
                pointer: {
                  show: true,
                  length: "75%",
                  radius: "50%",
                   "2.5%", //指针粗细
                },
                title: {
                  // 仪表盘标题。
                  show: false, // 是否显示标题,默认 true。
                },
                markLine: {
                  precision: 2,
                },
                axisTick: {
                  show: true,
                  splitNumber: 1,
                  lineStyle: {
                     1,
                    color: "rgba(255,255,255,.7)",
                  },
                  length: -8,
                }, //刻度样式
                splitLine: {
                  show: true,
                  length: -14,
                  lineStyle: {
                    color: "transparent", //用颜色渐变函数不起作用
                  },
                }, //分隔线样式
                axisLabel: {
                  show: true,
                  color: "#fff",
                  distance: -40,
                  fontSize: this.WidthAdaptive(30),
                },
                axisLine: {
                  // 坐标轴线
                  lineStyle: {
                    // 属性lineStyle控制线条样式
                     this.WidthAdaptive(40), // 仪表盘宽度
                    color: [
                      [0.2, "#0052A1"],
                      [0.4, "#217EC4"],
                      [0.6, "#20A6E4"],
                      [0.8, "#FFB300"],
                      [1, "#FFDC00"],
                    ],
                  },
                },
              },
              {
                name: "小圆形",
                type: "pie",
                hoverAnimation: false,
                legendHoverLink: false,
                zlevel: 0,
                center: ["50%", "70%"],
                radius: ["0%", "6%"],
                tooltip: {
                  show: false,
                },
                z: 10,
                label: {
                  normal: {
                    show: false,
                    position: "center",
                  },
                  emphasis: {
                    show: false,
                  },
                },
                labelLine: {
                  normal: {
                    show: false,
                  },
                },
                data: [
                  {
                    value: 100,
                    name: "2",
                    itemStyle: {
                      normal: {
                        color: "#fff",
                      },
                    },
                  },
                ],
              },
            ],
          };
          window.onresize = function () {
            myChart.resize();
          };
          myChart.setOption(option);
        },
      },
    };
    </script>
    <style scoped>
    .tu {
       100%;
      height: 100%;
    }
    </style>
    

      

  • 相关阅读:
    Android启动流程
    Android异步加载图像小结
    ViewPager的setOnPageChangeListener方法详解
    极光推送的集成
    物体旋转的问题gl.glTranslatef,gl.glRotatef如何饶物体的中心轴旋转
    实现生成星星,让星星自转和绕原点公转的简单demo。
    混色,半透明的设定,以及我们视角即屏幕处在-1层,-1层的物体是看不见的
    三维世界里的坐标和变换,逆方向旋转移动三维世界的方式来实现3D漫游
    OpenGL中glMatrixMode的使用,以及glPushMatrix和glPopMatrix的原理
    OpenGL纹理上下颠倒翻转的三种解决办法(转)
  • 原文地址:https://www.cnblogs.com/a973692898/p/16068053.html
Copyright © 2020-2023  润新知