当你打开ECharts的时候,,会看到很多高大上的精美图表,那么它该然后使用呢?当你拿到ECharts-docs的时候,解压后千万不要放在中文语录里面,建议把它直接放在C/D/E/F……等盘的根目录里面,一是方便查找,二是方便操作。如果当你无法启动ECharts-docs的时候·,那请你修改ECharts-docs文件中的端口号,例如:如果修改了端口号,访问地址将变成http://127.0.0.1:端口号/echarts3-docs(把端口号替换成你改的端口数字)。

那么如何获取ECharts呢?路径有以下几种,你可以根据你的情况进行选择:

  1. 最直接的方法是在ECharts的官方网站中挑选适合你的版本进行下载,不同的打包下载应用于不同的开发者功能与体积的需求,或者你也可以直接下载完整版本。
  2. 也可以在ECharts的GitHub上下载最新的release版本,解压出来的文件夹里的dist目录里可以找到最新版本的ECharts库
  3. 或者通过npm获取ECharts,npm install echarts—save
  4. 由cdn引入,你可以在cdnjs,npmcdn或者国内的bootcdn上找到ECharts的最新版本。

那么如何引入ECharts?

ECharts的引入方法1其实很简单的,ECharts的引入方法像JavaScript哭一样用Script标签就可以引入成功了。下面用我自己的一个例子来说明ECharts的使用,步骤如下:

首先这是ECharts插件引入的代码:

ECharts的使用

第一步:为ECharts准备一个具备大小宽高的demo

ECharts的使用

第二步:基于准备好的demo,初始化ECharts实例

ECharts的使用

第三步:指定图表的配置项和数据

ECharts的使用

第四步:使用刚指定的配置项和数据显示图表

ECharts的使用

最后,一个完美的饼状图就大功告成了。

ECharts的使用

  

 

相关文章: