Echarts

Echarts

        一.介绍

                ECharts，缩写来自 Enterprise Charts，商业级数据图表，是百度的一个开源的数据可视化工具，一个纯 Javascript 的图表库，能够在 PC 端和移动设备上流畅运行，兼容当前绝大部分浏览器（IE6/7/8/9/10/11，chrome，firefox，Safari等），底层依赖轻量级的 Canvas 库 ZRender，(Zrender是一个二维绘图引擎，它提供了Canvas，SVG，VML等多种渲染方式，Zrender也是Echarts的渲染器。)ECharts 提供直观，生动，可交互，可高度个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验，赋予了用户对数据进行挖掘、整合的能力。

        二.特点

                        1.丰富的可视化类型        

                                折线图，柱状图，饼状图，k线图，散点图……

                        2.多种数据的支持        

                                Key-value数据格式        二维表  TypedArray格式   流数据的支持

                        3.移动端的优化

                        4.跨平台的使用

                        5.绚丽的特效

                        6.三维可视化

        三.基本使用

                        1.下载js文化并引入并

                                https://www.jsdelivr.com/package/npm/echarts 选择 dist/echarts.js，点击并保存为 echarts.js 文件。

                        2. 引入 Apache ECharts

                

                         3. 绘制一个简单的图表

                                在绘图前我们需要为 ECharts 准备一个定义了高宽的 DOM 容器。在刚才的例子 </head> 之后，添加

        

                        4. 然后就可以通过 echarts.init 方法初始化一个 echarts 实例并通过 setOption 方法生成一个简单的柱状图，下面是完整代码

        

        

 四.初始化

        在 HTML 中定义有宽度和高度的父容器

        通常来说，需要在 HTML 中先定义一个 <div> 节点，并且通过 CSS 使得该节点具有宽度和高度。初始化的时候，传入该节点，图表的大小默认即为该节点的大小，除非声明了 opts.width 或 opts.height 将其覆盖。

 需要注意的是，使用这种方法在调用 echarts.init 时需保证容器已经有宽度和高度了。

        指定图表的大小

                如果图表容器不存在宽度和高度，或者，你希望图表宽度和高度不等于容器大小，也可以在初始化的时候指定大小。

 五.样式简介

         颜色主题（Theme）

                ECharts5 除了一贯的默认主题外，还内置了'dark'主题。可以像这样切换成深色模式：

                 如果主题保存为 JSON 文件，则需要自行加载和注册，例如

                 如果保存为 UMD 格式的 JS 文件，文件内部已经做了自注册，直接引入 JS 即可：

          调色盘

                调色盘，可以在 option 中设置。它给定了一组颜色，图形、系列会自动从其中选择颜色。 可以设置全局的调色盘，也可以设置系列自己专属的调色盘

 六.数据集

        简介

                数据集（dataset）是专门用来管理数据的组件。虽然每个系列都可以在  series.data 中设置数据，但是从 ECharts4 支持 数据集 开始，更推荐使用 数据 集 来管理数据。因为这样，数据可以被多个组件复用，也方便进行 “数据和 其他配置” 分离的配置风格。毕竟，在运行时，数据是最常改变的，而其他 配置大多并不会改变

        设置数据

                

         

         在数据集中设置数据也可以使用常见的“对象数组”的格式：

 

                 优点

                        能够贴近数据可视化常见思维方式：（I）提供数据，（II）指定数据到视觉的映射，从而形成图表。    

                        数据和其他配置可以被分离开来。数据常变，其他配置常不变。分开易于分别管理。    

                        数据可以被多个系列或者组件复用，对于大数据量的场景，不必为每个系列创建一份数据。    

                        支持更多的数据的常用格式，例如二维数组、对象数组等，一定程度上避免使用者为了数据格式而进行转换。：