数据可视化图表ECharts
介绍:
ECharts是一个基于ZRender(轻量级Canvas类库)的纯javascript图表库,提供可交互、个性化的数据可视化图表。
ECharts提供了折线图、柱状图、散点图、饼图、K线图,以及地图、热力图、关系图等多种图表API,并支持多图混搭。
ECharts一直在交互上不断的改进,最新版的ECharts3支持坐标轴、维度上对数据进行过滤、缩放、平移。对于数据的改变,ECharts会找到两组数据的差异,结合动画去表现数据的变化。对于地理数据,加入了酷炫的特效。
使用起来简单、易上手。

还能根据喜好,更换不同的主题

兼容性:
绝大部分浏览器都支持,IE8也支持哦。
使用:
首先要准备一个具备宽高的DOM容器
文件引入方式:
(一)传统的,通过<script>标签引入

(二)也可以使用模块化的方式
首先,可以通过npm安装ECharts

引入js

初始化:

配置文件:
然后就可以写配置文件啦,通过setOption生成所需要的图表。

title:图表标题
xAxis、yAxis:X轴、Y轴
series:系列列表,通过其中的type属性决定图表类型。
更多的参数配置可以参考这里:http://echarts.baidu.com/option.html#title
效果图:

数据可视化图表ECharts的更多相关文章
- Webstorm+Webpack+echarts构建个性化定制的数据可视化图表&&两个echarts详细教程(柱状图,南丁格尔图)
Webstorm+Webpack+echarts ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(I ...
- ECharts-基于Canvas,纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表
ECharts http://ecomfe.github.com/echarts 基于Canvas,纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.创新的拖拽重计算 ...
- Python调用matplotlib实现交互式数据可视化图表案例
交互式的数据可视化图表是 New IT 新技术的一个应用方向,在过去,用户要在网页上查看数据,基本的实现方式就是在页面上显示一个表格出来,的而且确,用表格的方式来展示数据,显示的数据量会比较大,但是, ...
- Excel数据可视化图表设计需要注意的几个问题
大数据发展迅速的时代,数据分析驱动商业决策.对于庞大.无序.复杂的数据要是没经过合适的处理,价值就无法体现. 可以想象一本没有图片的教科书.没有图表.图形或是带有箭头和标签的插图或流程图,那么这门学 ...
- 百度数据可视化图表套件echart实战
最近我一直在做数据可视化的前端工作,我用的最多的绘图工具是d3.d3有点像photoshop,功能很强大,例子也很多,但是学习成本也不低,做项目是需要较大人力投入的.3月底由在亚马逊工作的同学介绍下使 ...
- JavaScript—数据可视化(ECharts)
Echarts具有丰富的图表,可以说是数据可视化的神器: 1.下载Echarts 官网下载地址:https://echarts.baidu.com/index.html 2.Echarts引用案例—柱 ...
- 数据分析 | 数据可视化图表,BI工具构建逻辑
本文源码:GitHub·点这里 || GitEE·点这里 一.数据可视化 1.基础概念 数据可视化,是关于数据视觉表现形式的科学技术研究.其中,这种数据的视觉表现形式被定义为,一种以某种概要形式抽取出 ...
- CSDN开源夏令营 百度数据可视化实践 ECharts(4)
ECharts知识点总结: 在应用过程中总会遇到一些难以理解的概念和属性,这里就总结了一下比較难的知识点,方便理解概念.进而更好的掌握ECharts. (1)1. 一个完整的option包括什么?能 ...
- CSDN开源夏令营 百度数据可视化实践 ECharts(8)问题分析
ECharts问题描写叙述: 问题就是折线图上的点是显示的,有人问能不能一開始不显示,当你点击的时候或者是当鼠标移动到上面的时候,折线上的点才显示? 例如以下图所看到的: 分析:让折线上的点不显示能够 ...
随机推荐
- mysqlsla安装
#下载mysqlsla https://github.com/daniel-nichter/hackmysql.com yum install perl-ExtUtils-CBuilder per ...
- tky项目第②个半月总结
在上一篇半月总结中,介绍了tky项目的整体架构.项目的进展情况.项目的优势与开发中存在的问题等.今天来聊聊这半个月中,项目中发生的事情. 在这半个月中,项目中有了较大的突破:成功通过了国家评測中心的測 ...
- [redis] redis配置文件redis.conf的详细说明
# Redis 配置文件 # 当配置中需要配置内存大小时,可以使用 1k, 5GB, 4M 等类似的格式,其转换方式如下(不区分大小写) # # 1k => bytes # 1kb => ...
- virtualenv对python
使用virtualenv对python进行多版本隔离 最近在用python做一个文本的情感分析的项目,用到tensorflow,需要用python3的版本,之前因为<机器学习实战>那本书的 ...
- 二叉堆(binary heap)—— 优先队列的实现
二叉堆因为对应着一棵完全二叉树,因而可以通过线性数组的方式实现. 注意,数组第 0 个位置上的元素,作为根,还是第 1 个位置上的元素作为根? 本文给出的实现,以数组第 1 个位置上的元素作为根,则其 ...
- iOS QLPreviewController(Quick Look)快速浏览jpg,PDF,world等
#import <QuickLook/QuickLook.h> @interface ViewController ()<QLPreviewControllerDataSource, ...
- 基于Linux应用层的6LOWPAN物联网网关及实现方法
本发明涉及一种基于Linux应用层的6LOWPAN物联网网关及实现方法,所述物联网网关包括开发平台以及无线射频模块,其实现方法是:所述6LOWPAN物联网网关的以太网网口收到访问6LOWPAN无线传感 ...
- leetcode——Reverse Words in a String 旋转字符串中单词顺序(AC)
题目例如以下: Given an input string, reverse the string word by word. For example, Given s = "the sky ...
- scala map的常用操作
package cn.scala_base /** * map常用操作 */ object Map { def main(args: Array[String]): Unit = { //1.不可变m ...
- CentOS 配置epel源
先查询下有没有epel rpm -qa|grep epel 没有的话到官网https://fedoraproject.org/wiki/EPEL下载rpm包 然后 rpm -ivh 安装 安装完毕后到 ...