1. Echarts環境配置
https://www.echartsjs.com/zh/download.html
選擇需要的，然后等待Build完成之后，就會自動彈出下載框啦！
把下載好的js放在web目錄下~
然后在對應的jsp內導入噢~<script src="echarts.min.js"></script>
2.Echarts代碼
https://www.echartsjs.com/examples/zh/index.html官方文檔非常好使！大拇指！
參考博客:https://blog.csdn.net/qq_41186788/article/details/79607005(實例）
<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="<%=request.getContextPath()%>/echarts/echarts.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/jquery/jquery.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<div id="main" style="width: 600px;height:400px;"></div>
</body>
<script type="text/javascript">
// 基於准備好的dom，初始化echarts實例
var myChart = echarts.init(document.getElementById('main'));
// 指定圖表的配置項和數據
var option = {
title: {
text: 'ECharts 入門示例'
},
tooltip: {},
legend: {
data:['銷量']
},
xAxis: {
data: ["襯衫","羊毛衫","雪紡衫","褲子","高跟鞋","襪子"]
},
yAxis: {},
series: [{
name: '銷量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
};
// 使用剛指定的配置項和數據顯示圖表。
myChart.setOption(option);
</script>
</html>
3.EL表達式
先在Servlet里setAttribute噢！
Map:
List
直接f.屬性名就好啦！
4.EL表達式在js里如何使用呢~
https://blog.csdn.net/qq_38880700/article/details/82771822（el表達式循環遍歷數組,list和json）
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<div id="main" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
// 基於准備好的dom，初始化echarts實例
var myChart = echarts.init(document.getElementById('main'));
var pants=[];
<c:forEach items="${list}" var="l">
pants.push("${l}");
</c:forEach>
// 指定圖表的配置項和數據
var option = {
title: {
text: 'ECharts 入門示例'
},
tooltip: {},
legend: {
data:['銷量']
},
xAxis: {
data: pants
},
yAxis: {},
series: [{
name: '銷量',
type: 'bar',
data: [5, 10, 10, 20]
}]
};
// 使用剛指定的配置項和數據顯示圖表。
myChart.setOption(option);
</script>
