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. centos下LVM配置与管理

    centos下LVM配置与管理 LVM是逻辑盘卷管理(Logical Volume Manager)的简称,它是Linux环境下对磁盘分区进行管理的一种机制,LVM是建立在硬盘和分区之上的一个逻辑层, ...

  2. pycharm快捷键一览

    编辑(Editing) Ctrl + Space 基本的代码完成(类.方法.属性)Ctrl + Alt + Space 快速导入任意类Ctrl + Shift + Enter 语句完成Ctrl + P ...

  3. Matplotlib库介绍

    pyplot的plot()函数 pyplot的中文显示 pyplot的文本显示 pyplot的子绘图区域

  4. Ubuntu下配置LAMP + PhpStorm

    本文仅作为一个记录,以下配置在Ubuntu 14.10 64-bit上验证通过. 安装Apache 2:sudo apt-get install apache2 安装成功能够后,通过浏览器访问loca ...

  5. Web性能测试问题,mysql分析之一

    在做性能测试执行中,发现性能很慢,顺藤摸瓜找一下是什么问题? 并发40个用XXX场景 1.运行过程中监控mysql数据库的CPU过高,达到65%: %CPU   %Mem  %Disk   %Net ...

  6. 如何对比两个Jar包

    如果对比两个jar包呢?jar 都是class 文件,我对比jar,就是想知道,它增加了删除了哪些方法.增加了哪些类,删除了哪些类. 有很多方法,你可以,反编译,然后通过beyongCompair 去 ...

  7. JavaSE总结--面向对象

    封装: 1)为什么要用private修饰 保护属性或方法不被别人随意调用. 继承: 继承模型: 多态: 接口: 抽象类: 内部类: 在编译时用$分隔. 访问局部变量,该变量必须用final修饰. 向下 ...

  8. 大中型 UGC 平台的反垃圾(anti-spam)工作

    本文来自网易云社区 随着互联网技术的日渐发展,相继诞生了垂直社区.社交平台.短视频应用.网络直播等越来越多样的产品.但在内容爆炸式增长的同时,海量UGC中也夹杂着各种违规垃圾信息,包括垃圾广告.诈骗信 ...

  9. 用CSS伪元素制作箭头

    现在让我们开始制作箭头吧! 在开始前,你要知道如何用CSS去画一个三角形,如果还不清楚可以看看这里纯CSS画各种图形 我们用到两个CSS伪元素,before和after,它们属于行内元素,但可以用di ...

  10. USACO Section2.3 Longest Prefix 解题报告 【icedream61】

    prefix解题报告------------------------------------------------------------------------------------------ ...