echarts體積很大,在移動端使用非同步載入是一種提高渲染速度的方法,結合webpack的做法如下:
require.ensure([], function(require){ const echarts = require('assets/js/lib/echarts.min'); if(echarts){ _self.fInitEcharts(echarts); if(_self.dateList.length && _self.rateList.length){ _self.fSetEcharts(); } } },'echarts'); //初始化echarts fInitEcharts(echarts) { var id = this.user.isInvest == 0 ? 'container' : 'container_invest'; var dom = document.getElementById(id); this.myChart = echarts.init(dom); } //設定echart選項 fSetEcharts(){ if(this.myChart){ const size = fGetChartFontSize(); const option = ...; this.myChart.setOption(option, true); } }