代码更新

surprise

2024-05-09 e897fc3d35f8e5dfa56d5f0c80a655ccf99202cf

 src/components/echart12.vue

@@ -8,7 +8,7 @@
export default {
  data() {
    //这里存放数据
    return { myChart };
    return { myChart: null };
  },
  //方法集合
  methods: {
@@ -131,20 +131,25 @@
        title: {
          // show: false,
          text: '数据及服务提交',
          // x: "4%",
          top: '15',
          textStyle: {
            color: '#fff',
            // fontSize: "22",
          },
          show: false
          // subtextStyle: {
          //   color: "#90979c",
          //   fontSize: "16",
          // },
        },
        // 图表的位置
        // grid: {
        //   position: "center",
        // },
        //  图表的位置
        grid: {
          top: '10',
          left: '0%',
          right: '0%',
          bottom: '0%',
          containLabel: true,
        },

        color: colorArr,
        legend: {
@@ -169,10 +174,10 @@
              fontSize: 12,
            },
          },
          radius: 120,
          radius: 80,
          nameGap: 2, // 图中工艺等字距离图的距离
          splitNumber: 4, // 网格线的个数
          // center: ["45%", "45%"], // 图的位置
          center: ["50%", "45%"], // 图的位置

          indicator: indicator,
          splitArea: {
@@ -186,12 +191,12 @@
          axisLine: {
            //指向外圈文本的分隔线样式
            lineStyle: {
              color: '#153269',
              color: '#FFF',
            },
          },
          splitLine: {
            lineStyle: {
              color: '#113865', // 分隔线颜色
              color: '#FFF', // 分隔线颜色
              width: 1, // 分隔线线宽
            },
          },
@@ -227,10 +232,12 @@
//@import url(); 引入公共css类
.systemMonitoring_box {
  padding: 20px;
  width: 100%;
  height: 100%;

  #gauge_chart1 {
    width: 100%;
    height: 100%;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
  }
}
</style>