echarts load asynchronously

Echarts is very large. Using asynchronous loading on the mobile side is a way to improve the rendering speed. The method combined with webpack is as follows:

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);
}

// Set the echart option 
fSetEcharts(){
     if ( this .myChart){
        const size = fGetChartFontSize();
        const option = ...;
        this.myChart.setOption(option, true);
    }
}

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325128245&siteId=291194637