Echarts是百度团队打造的一款纯Javascript的图标库,官网下载地址:http://echarts.baidu.com/download.html
Echarts的特性:
丰富的图表类型:常用的有折线图,柱状图,散点图,饼图,用于地理数据可视化的地图,热力图,线图等。
基本使用:
1引入echarts.js文件包,可以在官网上下载。
2、准备一个容器装图表,需要设置容器的ID,可以设置图表显示的宽高大小
3、初始化echarts实例
4、指定图表的配置项和数据,即设置option
title:标题组件
tooltip:提示框组件
legend:图例组件,展示了不同系列的标记,颜色和名字
xAxis:直角坐标系,gird中的x轴,单个grid组件最多只能放上下两个x轴。
yAxis:直角坐标系,grid中的y轴,单个grid组件最多只能放左右两个y轴。
series:系列列表。每个系列通过type决定自己展示的图表类型。
series[i]-line=====折线图
series[i]-bar=====柱状图
series[i]-pie=====饼图
series[i]-scatter=====散点图
series[i]-effectScatter=====带有涟漪特效动画的散点(气泡)图
series[i]-radar=====雷达图
series[i]-treemap-Treemap=====是一种常见的表达【层级数据】【树桩数据】的可视化形式
series[i]-boxplot-Boxplot=====中文可以称为【箱型图】、【盒须图】、【盒式图】【箱线图】
series[i]-candlestick-Candlestick=====即我们常说的k线图
series[i]-map=====地图主要用于地理区域数据可视化,配合visuaLMap组件用于展示不同区域的人口分布密度等数据
series[i]-parallel=====平行坐标系的系列
series[i]-lines=====线图
series[i]-graph=====关系图
series[i]-gauge=====仪表盘
5、使用指定的配置项和数据显示
这样就出来简单的柱状图了;
如果是饼图的话就不要X,Y轴了。type:“pie”,并且data的数据需要换成