第一个 ECharts 实例

ECharts 基本图形一、实验原理展示 ECharts 的一些常用图形的示例和用法。二、实验步骤柱状图柱状图（bar），是一种以长方形的长度为变量的统计报告图，由一系列长度不等的纵向条纹来表示数据分布情况，只有一个变量，通常用于较小的数据集分析。柱状图亦可横向排列（条形图），或用多维方式表达，形成三维立体柱状图，柱状图的每根柱体内部还可以再细化，形成堆叠图。案例 1：第一个 ECharts 实例

copy 运行效果如下： ![image.png](https://dn-simplecloud.shiyanlou.com/courses/uid1492895-20201003-1601701917152) 案例 2：第一个 ECharts 实例

copy 运行效果如下： ![image.png](https://dn-simplecloud.shiyanlou.com/courses/uid1492895-20201003-1601701903339) 如果要做更加丰富的柱状图的话，可以参考上面的详细参数配置项和官方网站中柱状图示例。饼图饼图主要是通过扇形的弧度表现不同类目的数据在总和中的占比，它的数据格式比柱状图更简单，只有一维的数值，不需要给类目。因为不在直角坐标系上，所以也不需要 xAxis，yAxis。案例 1：第一个 ECharts 实例

copy 运行效果如下： ![image.png](https://dn-simplecloud.shiyanlou.com/courses/uid1492895-20201003-1601702017375) 案例 2：第一个 ECharts 实例

copy 代码运行效果如下： ![image.png](https://dn-simplecloud.shiyanlou.com/courses/uid1492895-20201003-1601702050615) 案例 3：第一个 ECharts 实例

copy 代码运行效果如下： ![image.png](https://dn-simplecloud.shiyanlou.com/courses/uid1492895-20201003-1601702065741) 如果要做更加丰富的柱状图的话，可以参考上面的详细参数配置项和官方网站中饼图示例。折线图折线图（line）又叫线图，是将数据集中行或列的数据绘制到折线图中，适用于二维大数据集，特别是数据趋势比单个数据点更重要的应用场景。折线图可以显示随时间而变化的连续数据，因此非常适用于显示在相等时间间隔下数据的趋势。在基本二维折线图基础上，还可以绘制带数据标记的折线图、堆积折线图、三维折线图等。散点图散点图是指在回归分析中，数据点在直角坐标系平面上的分布图，散点图表示因变量随自变量而变化的大致趋势，据此可以选择合适的函数对数据点进行拟合。异步加载数据之前的图表的数据都是写死的，ECharts 通常数据设置在 setOption 中，如果我们需要异步加载数据，可以配合 jQuery 等工具，在异步获取数据后通过 setOption 填入数据和配置项就行。

“1+X 大数据实训课程”实验报告