echarts.js圖表寬度自適應的問題

echarts.js的官方文檔，找到了這一句

window.onresize = myChart.resize;   

加上去，就可以自適應了

 

當然了，針對一個頁面有多個圖表，這種原生js 的window.onresize 只能生效最後一個，那就加個jQuery吧

$(window).resize(function() {
myChart.resize();
});

以上轉載：http://blog.sina.com.cn/s/blog_99bf42650102yilg.html

 

自己的vue項目代碼

methods: {
    initChart() {
        this.chart = this.$echarts.init(this.$refs.realtimeCurve)
        this.chart.setOption(this.option)
    }
},

updated() {
    this.initChart()
    window.onresize = this.chart.resize
}

遇到的問題：

遇到了和這個博主一樣的問題：echarts圖表自適應，容器寬度設置爲百分數，但是圖表顯示不全，縮到一起https://blog.csdn.net/zhangshab/article/details/81364943

原因：

是將原來的初始化和resize放在mounted鉤子函數中導致的，將mounted鉤子函數改爲updated鉤子函數，問題解決。