ECharts和Highcharts 简单教程

Canvas适用场景Canvas提供的功能更原始，适合像素处理，动态渲染和大数据量绘制

SVG适用场景SVG功能更完善，适合静态图片展示，高保真文档查看和打印的应用场景

ECharts（国内的）        Highcharts（外国）

Highcharts 

Highcharts 是一个用纯JavaScript编写的一个图表库。

Highcharts 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表

Highcharts 目前支持直线图、曲线图、曲线面积图、面积图、面积范围图、柱状图、条形图、饼图、散点图、气泡图、仪表图等丰富的图表类型。

菜鸟教程在线编辑器可以测试效果，使用时候去查，不记

Highcharts 环境配置

Highcharts 与 jQuery 结合使用，所以在加载 Highcharts 前必须先加载 jQuery 库，然后加载自己库，cdn

Highcharts 配置语法

第一步：创建 HTML 页面

第二步: 创建配置文件

Highcharts 库使用 json 格式来配置。

$('#container').highcharts(json);

完整的实例(HighchartsTest.htm)：

Highcharts 提供大量的配置选项参数，可以轻松定制符合用户要求的图表

Highcharts 配置选项详细说明

参数配置(属性+事件)

chart.events.load：图表加载事件。

Chart：图表区选项
Color：颜色选项
Title：标题选项
Subtitle：副标题选项
xAxis：X轴选项

Series：数据列选项

…………

Highcharts 异步加载数据曲线图表

通过 jQuery.getJSON() 方法从异步加载 csv 文件