Echarts图表

在使用图表时需要Apache Echarts官网，打开官网可以下载脚本文件 <script src="~/Plugins/echarts/echarts.min.js"></script>，引入页面

绘制一个简单的图表

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

三步操作：

1.绘制图表，基于准备好的dom，初始化echarts实例

2.指定图表的配置和数据

3.使用刚指定的配置项和数据显示图表

如制作饼图：找到相对应的饼图进行修改达到想要的效果

 

了解配置项个参数的意思，在文档==》打开配置项手册

第二步：指定图表的配置和数据

 

注：在data:[

{ value: achievementData.Score100, name: '合格（100）',itemStyle:{color:’#ccc’}}

//可添加颜色样式

]

1.图表与页面数据的数据改变要声明全局变量如图：

2.获取条件 查询页面下拉框的内容

 

 

3.声明全局变量后图例的值也要改变，以页面的实际数据来定

 

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

//简单的图表已完成