vue使用echartst v-show宽度变100px解决办法

最新推荐文章于 2023-07-23 09:53:10 发布

热心的web市民

最新推荐文章于 2023-07-23 09:53:10 发布

阅读量603

点赞数

文章标签： vue

本文链接：https://blog.csdn.net/qq_41009420/article/details/119737929

版权

在 myChart.setOption(option); 后面加上myChart.resize(); 即可完美解决

例如

drawChart() {
      var myeChart2 = echarts.init(document.getElementById("main2"));
      var myeChart3 = echarts.init(document.getElementById("main3"));
      // 指定图表的配置项和数据
      var option2 = {
        tooltip: {},
        color: "rgba(30,144,255,1)",
        xAxis: {
          data: this.targetlist2, //二级
          axisLabel: {
            interval: 0,
            rotate: 0,
          },
        },
        barMaxWidth: 60,
        yAxis: {},
        series: this.serieslist2,
        legend: {
          data: this.serieslist2.name, //城市
        },
      };
      var option3 = {
        tooltip: {},
        color: "rgba(30,144,255,1)",
        xAxis: {
          data: this.targetlist3, //三级
          axisLabel: {
            interval: 0,
            rotate: 0,
          },
        },
        barMaxWidth: 60,
        yAxis: {},
        series: this.serieslist3,
        legend: {
          data: this.serieslist3.name, //城市
        },
      };
      // 使用刚指定的配置项和数据显示图表。
      myeChart2.clear();
      myeChart3.clear();
      myeChart2.setOption(option2);
      myeChart3.setOption(option3);
      myeChart3.resize(); //------------此处添加---------------
    },