ECharts概念学习系列之ECharts官网教程之自定义构建 ECharts(图文详解)

时间:2021-09-30 19:40:28

 

 

    不多说,直接上干货!

 

  官网

http://echarts.baidu.com/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts

ECharts概念学习系列之ECharts官网教程之自定义构建 ECharts(图文详解)

 

 

 

 

 

 

 

自定义构建 ECharts

  一般来说,可以直接从 echarts 下载页 中获取构建好的 echarts,也可以从 GitHub 中的 echarts/dist 文件夹中获取构建好的 echarts,这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制:

  • 完全版:echarts/dist/echarts.js,体积最大,包含所有的图表和组件,所包含内容参见:echarts/echarts.all.js
  • 常用版:echarts/dist/echarts.common.js,体积适中,包含常见的图表和组件,所包含内容参见:echarts/echarts.common.js
  • 精简版:echarts/dist/echarts.simple.js,体积较小,仅包含最常用的图表和组件,所包含内容参见:echarts/echarts.simple.js

  如果对文件体积有更严苛的要求,可以自己构建 echarts,能够仅仅包括自己所需要的图表和组件。自定义构建有几种方式:

  • 在线自定义构建:比较方便。
  • 使用 echarts/build/build.js 脚本自定义构建:比在线构建更灵活一点,并且支持多语言。
  • 直接使用构建工具(如 rollupwebpackbrowserify)自己构建:也是一种选择。

 

 

 

  下面我们举些小例子,介绍后两种方式。