ECharts 对比 Highcharts 使用教程

Highcharts是用JavaScript编写的图表库，支持各种常用的可视化。作为同类可视化产品，ECharts与Highcharts的对比如下。

图表种类角度

目前ECharts和Highcharts的官网展示的共有可视化图表包括折线图、面积图、柱状图、条形图、饼图、环形图、散点图、气泡图、仪表图、关系图、热力图、矩形树图、雷达图、玫瑰图、箱线图、瀑布图、漏斗图、词云图（ECharts 2.0官网展示）、直方图、甘特图、桑基图、河流图、和弦图、误差图、混合图、3D图、地图（Highmaps展示）等。
不同的是，ECharts官网还展示了树图、路径图、旭日图、象形柱图、日历坐标系等。而Highcharts官网还展示了子弹图、蜂巢图等。
注意，以上可视化图表类型中不包括用户开发上传展示的各种形式的图表。

非商业和商业使用角度

ECharts可免费使用，Highcharts在个人学习、个人网站和非商业用途使用时免费，在供商业使用时需要付费。

可视化技术角度

最新的ECharts支持Canvas和SVG两种渲染方式，Highcharts支持SVG渲染方式。
SVG是指可伸缩矢量图形（Scalable Vector Graphic），历史悠久，是一种使用XML描述2D图形的语言，特点是不依赖分辨率，支持事件处理器，不适合游戏应用。
Canvas是HTML5提供的新元素，它通过JavaScript来绘制2D图形，较新，特点是依赖分辨率，不支持事件处理器，适合图像密集型游戏，对大数据绘图支持较好。

安装ECharts

首先打开ECharts官网的下载页面（https://echarts.apache.org/zh/download.html），可以看到下载页面如

可以任意选择一个版本，这里选择方法一“从下载的源代码或编译产物安装”的方式（我这里选择的是4.3.0版本），之后会跳转到具体的下载页面，

在本地新建一个文件夹，将下载的安装包复制到该文件夹中，然后在文件夹中解压压缩包，解压后的内容如

至此你已经成功安装了ECharts环境，之后直接调用里面的文件即可使用ECharts。

开发工具选择

这里的开发工具指的是编程工具，即使用何种编程工具进行后续的ECharts可视化内容制作。选择因人而异，如果你已经有自己喜欢的编程工具，可以继续用该工具编写ECharts可视化代码。我个人比较习惯和推荐的是微软的VS Code，该工具支持多种编程语言的编写。
如果你决定使用VS Code，可以按照如下步骤下载、安装和使用，当然，你也可以按照其他教程安装VS Code。
首先打开VS Code的下载页面（https://code.visualstudio.com/），如图
点击右上角Download的蓝色按钮，会跳转到具体的下载页面（https://code.visual-studio.com/Download）。在页面上选择适配电脑系统的安装包，这里选择的是Windows的System Installer 64bit安装包。不同系统环境安装包页面如图
下载完成后按照步骤安装，在安装时，首先会出现是否接受协议的对话框
选中“我接受协议”选项后点击“下一步”按钮，进入选择安装位置界面
确认安装位置后，系统会询问是否创建快捷方式以及是否创建其他快捷方式