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

echarts异步加载的更多相关文章

  1. echarts异步加载柱状图遇到的错误- Error: Component series. not exists. Load it first.

    今天看了下echarts教程之中的异步加载柱状图,我按照教程中的代码敲出来之后再运行,就报了一个 Error: Component series. not exists. Load it first. ...

  2. 小程序中使用ECharts 异步加载数据

    官网例子都是同步的,怎么引入及同步demo请移步官网 <view class="container"> <ec-canvas id="mychart-d ...

  3. 微信小程序中使用ECharts 异步加载数据 实现图表

    <!--pages/bar/index.wxml--> <view class="container"> <ec-canvas id="my ...

  4. H5+JS+JQuery+ECharts实现异步加载

    这几天,看了一下ECharts官网的API和Demo发现很有意思,于是就利用模型预测产生的数据做一个伪实时的动态数据显示 . 首先,创建一个index.html的文件,我用的vscode打开的,进行编 ...

  5. 学习Echarts:(二)异步加载更新

    这部分比较简单,对图表的异步加载和更新,其实只是异步获取数据然后通过setOption传入数据和配置而已. $.get('data.json').done(function (data) { myCh ...

  6. 26、首先通过javascript包的异步加载来学习echarts包的结构

    1.在这里先写一写前言,今天在公司搞定了一个对于滚动条进行定位的case,明天开始做TestManagement. 首先大家先来一起看一看流行的javascript文件的加载方式,这里采用别人博客上的 ...

  7. winform异步加载数据到界面

    做一个学习记录. 有两个需求: 1.点击按钮,异步加载数据,不卡顿UI. 2.把获取的数据加载到gridview上面. 对于需求1,2,代码如下: public delegate void ShowD ...

  8. 【Android】纯代码创建页面布局(含异步加载图片)

    开发环境:macOS 10.12 + Android Studio 2.2,MinSDK Android 5.1 先看看总体效果 本示例是基于Fragment进行的,直接上代码: [界面结构] 在 F ...

  9. 【代码笔记】iOS-实现网络图片的异步加载和缓存

    代码: - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. se ...

随机推荐

  1. DB设计工具——dbschema

      Preface       I've got a db design job about meeting room booking system last week.There're many s ...

  2. JAVA / MySql 编程——第二章 初始MySQL

    1. MySQL:        ●  MySQL是一个关系型数据库管理系统,由瑞典MySQL AB公司开发,目前属于Oracle公司.            MySQL最流行的关系型数据库管理系统, ...

  3. MySql编码、卸载、启动问题

    一.启动问题 计算机------管理------服务------找到MySql------右键------启动或停止 问题:打开Mysql,点击 MySQL Command Line Client,输 ...

  4. MySQL基础 (麦子学员 php 第二阶段)

    通过my.ini配置文件修改字符集:客户端字符集设置:[mysql]default-character-set=utf8 [mysqld] character-set-server=utf8 .设置之 ...

  5. 010---Django的模型层(2)

    确定模型关系: ''' Publish ---- Book 多对一:一个出版社对应多本书,在多的那张表添加关联字段 Book ---- Author 多对多:一个书对应多个作者,多个作者对应一本书 会 ...

  6. TouTiao开源项目 分析笔记4==>一个简单APP 整体常用框架

    1.效果预览 1.1.如下图所以,到目前为止所有的功能. 2.从InitApp开始->SplashActivity->MainActivity 2.1.InitApp源代码.这是整个项目的 ...

  7. issubclasss/type/isinstance/callable/super

    issubclass() : 方法用于判断第一个参数是否是第二个参数的子子孙孙类. 语法:issubclass(sub, super) 检查sub类是否是 super 类的派生类 class A: p ...

  8. java练习题——字符串

    一.动手动脑之String.equals()方法: 判断s1和s2的内容相同s1.equals(s2). 判断s1和s2的地址相同s1 == s2. 二.整理String类的Length().char ...

  9. [Python3.x]python3.5实现socket通讯(TCP)

    TCP连接: tcp是面向连接的一个协议,意味着,客户端和服务器开发发送数据之前,需要先握手创建一个TCP连接.TCP连接的一端与客户端套接字相互联系,另一端与服务器套接字相联系.当创建该TCP连接的 ...

  10. Hyper-V在线调整虚拟硬盘大小

    从Windows Server 2012 R2 开始,可以在线调整虚拟硬盘的大小了,这意味着当虚拟硬盘不够用时,我们在虚拟机运行的情况下直接扩展虚拟硬盘容量了.有人说这个有什么用?当然,实验室情况下, ...