Echarts.js简介

JavaScript015

Echarts.js简介,第1张

在平时开发项目时,免不了需要对数据进行图表显示的需求,比如:趋势图、饼状图、柱形图等。

Echarts.js是来自百度团队研发的图表js插件,利用HTML+js实现折线图、饼状图、热点图、3d图形等等,可在PC和移动端显示,加载速度快,功能丰富。

https://echarts.apache.org/zh/index.html

官网首页有着很多实例以及相关介绍,获取echart.js可以从本人百度网盘获取,包含所有图表组件,可直接引用。

链接: https://pan.baidu.com/s/1IEm8NGwqq4ExgYWp8mz9CA

提取码:aihy

为Echarts放置一个具备宽高的DOM容器

Echarts加载数据

1、引入echarts的js文件;2、通过var,mychartDiv=document.getElementById("id")获取div对象,然后在此div中填图表数据,理解这个就很清楚的知道怎么在一个页面中放入多个图表了3、获取div对象后可以通过var myEchart=echarts.init(mychartDiv)初始化echarts实例;4、通过myEchart.removeAttribute("_echarts_instance_")在每次清空后重新加载;(本节标题的重点)6、最后,通过前面得到的实例通过myEchart.setOption(echartOption,true)即可删除图表

是一个 百度旗下 使用各种图表展示统计分析结果的js插件

引入这个js,你就可以使用echarts官网上提供的所有图表工具

官网链接:网页链接

如图所示: