Baidu ECharts知识梳理

从如何使用echart,接口,option和echart如何工作四个方面学习了echart。

如何使用:(模板项目)上周的10+微博用户可视化主要是模板项目

1.引入一个模块加载器,esl.js或者require.js

2.为ECharts准备一个具备大小宽高的Dom

3.为模块加载器配置echart的路径,连接到echarts.js定义所需图标路径。

require.config({

path:{

echarts:‘./js/echarts‘,

‘echarts/chart/bar‘:‘./js/echarts‘,

‘echarts/chart/line‘:‘./js/echarts‘

}});

4.动态加载echarts然后在回调函数中开始使用,不管是单文件还是包引入都需要显式按需加载图表。

require(

[

‘echarts‘,

‘echarts/chart/bar‘,

‘echarts/chart/line‘

],

function(ec){

var dom=document.getElementById(‘main‘);

var myChart=ec.init(dom);

var option={.....}  拷option当模板?

myChart.setOption(option);      })

(非模板项目)

1.直接script标签式引入

2.为ECharts准备一个具备大小宽高的Dom

3.echarts和zrender被写入为全局接口直接使用

var myChart=echarts.init(document.getElementById(‘main‘));

myChart.setOption({

tooltip:{

trigger:‘axis‘

},

legend:{

data:[‘蒸发量‘,‘降水量‘]}

}),

4.拷option当模板

接口:

初始化(实例化)唯一接口方法:init

通过require获得echarts接口后可通过init方法实例化图表,执行init时传入一个具备大小的dom节点后即可实例化出图表对象,echarts实现为多实例的,同一页面可多次init出多个图表。

时间: 2024-10-11 20:59:05

Baidu ECharts知识梳理的相关文章

指针知识梳理7- 函数指针

一.函数的地址 前面讲 程序运行起来以后,在内存中有代码区,程序运行每一条指令,是从内存中读出来这条指令,然后再运行. 所谓函数的地址是指函数的入口地址,这个函数的从这个地址開始进入运行,也就是从这个地址处取指令运行. 那么在代码层面,函数的地址用 函数指针变量 来存储. 二.基本使用 1.函数指针定义 函数指针的定义,在语法看起来略微有点怪,仅仅须要记住形式 返回值 (*指针变量名)(形參类型): 比方,下面4个函数 void func1(void) { } int func2(void) {

[SQL] SQL 基础知识梳理(一)- 数据库与 SQL

SQL 基础知识梳理(一)- 数据库与 SQL [博主]反骨仔 [原文地址]http://www.cnblogs.com/liqingwen/p/5902856.html 序 目录 What's 数据库 数据库结构 SQL 概要 创建表 删除和更新表 1-1 What's 数据库 1.数据库(Database,DB):将大量数据保存起来,通过计算机加工而成的可以进行高效访问的数据集合.如:大型-银行存储的信息,小型-电话簿. 2.数据库管理系统(Batabase Management Syste

JavaScript基础知识梳理--数组

JavaScript基础知识梳理--数组 1.创建方法 空数组:var obj=new Array(); 指定长度数组: var obj=new Array( size ); 指定元素数组 :  var obj=new Array( 元素1,元素2,....): 单位数组:var obj=new Array[ 元素1,元素2,元素3,...,元素N]; 多维数组:var a=new Array( [数组1],[数组2],[数组3],...,[数组N] ); 2.基本操作 存取数组元素: 单维数组

Java基础知识梳理《一》

一.Java数据类型(简单称之为“四类八种”) java 基本的数据类型长度都是固定的,好处是在实现跨平台时就统一了. 1.整型 byte short int long (分别是1,2,4,8个字节) 类型 存储需求 位数 取值范围 byte 1字节 8位 -128~127 short 2字节 16位 -2^15 ~2^15-1 int 4字节 32位 -2^31~2^31-1 long 8字节 64位 -2^63~2^63-1 当超出int表示范围时,应该使用long型,添加后缀一大写的L 注

struts2 知识梳理

一:struts.xml配置详解: 1.<include> 表示引入其他配置文件 2.<constant> 定义常量 3.<package>:  属性 是否必需 描述name 是 包名,作为其它包应用本包的标记extends 否 设置本包继承其它包namespace 否 设置包的命名空间,会改变url,abstact 否 设置为抽象包 4<action>和<result> <action>有name,class,method,conv

指针知识梳理6-const与指针

const 定义的变量为只读变量,在语法层面上通过这个变量去修改内存是不允许的. 但是对于以下代码,就有很多人绕了: const int  *p1;  //p1能变,*p1不能变 int const  *p2;  //p2能变,*p2不能变 int *const  p3;  //p3不能变,*p2能变 我们通过代码来验证说明这三种写法: </pre><p></p><pre> #include <stdio.h> int main() { int

[SQL] SQL 基础知识梳理(四) - 数据更新

SQL 基础知识梳理(四) - 数据更新 [博主]反骨仔 [原文]http://www.cnblogs.com/liqingwen/p/5929786.html 目录 一.插入数据 1.INSERT 语句的基本语法 --语法: --INSERT INTO <表名>(列1, 列2, ...) VALUES (值1, 值2, ...) INSERT INTO dbo.Shohin ( shohin_id , shohin_mei , shohin_bunrui , hanbai_tanka , s

[C#] C# 6.0 的知识梳理(整理中)

C# 6.0 的知识梳理 序 目前最新的版本是 C# 7.0,VS 的最新版本为 Visual Studio 2017 RC,两者都尚未进入正式阶段.C# 6.0 虽说出了一段时间,但是似乎有许多园友对这一块知识并不了解,如拼接字符串的 $ 符号,在此,小人献上拙作一篇<C# 6.0 的知识梳理>,祝大家在新的一年里:年年有今日,岁岁有今朝,月月涨工资,周周中彩票,天天好心情,日日好运道,白天遇财神,夜晚数钞票. 好了,废话不多说,我们先来回顾一下 C# 的版本史.后续我会对带 0 的版本号进

[SQL] SQL 基础知识梳理(三)- 聚合和排序

SQL 基础知识梳理(三)- 聚合和排序 [博主]反骨仔 [原文]http://www.cnblogs.com/liqingwen/p/5926689.html 目录 一.对表进行聚合查询 1.聚合函数 (1)5 个常用函数: ①COUNT:计算表中的记录(行)数. ②SUM:计算表中数值列的数据合计值. ③AVG:计算表中数值列的数据平均值. ④MAX:求出表中任意列中数据的最大值. ⑤MIN:求出表中任意列中数据的最小值. (2)聚合:将多行汇总成一行. 图1-1 Shohin 表 2.计算