echarts使用 教程
参考:
http://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts
第一步、引入echarts.js库文件
第二步、准备放图表的容器
第三步、设置参数,初始化
·
做实验:把type由bar(柱状图)改成line(折线图)
饼图:
个性化
echarts.js刚开始学的时候,大家最大的困惑是配置项太多了,根本记不住,其实,我们根本不需要记这些配置项,因为没有人记得住的,我们可以使用tushuo.baidu.com这个网站:
动态显示
到目前为止,我们的数据全部是静态的,我们的数据肯定是需要来自动态数据的。
移动端显示
为了能完美的在移动端显示,echarts.js做了很多工作。
首先,各个配置项,除了有px这种写死的方法外,还可以用百分比的方式:
其次,对各个东西还可以设置居左居中居右:
如果上面的还满足不了需求,echarts还实现了一套类似CSS3中的媒体查询的功能:
http://echarts.baidu.com/tutorial.html#%E7%A7%BB%E5%8A%A8%E7%AB%AF%E8%87%AA%E9%80%82%E5%BA%94