ECharts 是中國的，也是世界的！
ECharts官網：
ECharts，一個使用 JavaScript 實現的開源可視化庫，可以流暢的運行在 PC 和移動設備上，兼容當前
絕大部分瀏覽器（IE8/9/10/11，Chrome，Firefox，Safari等），底層依賴輕量級的矢量圖形庫 ZRender，
提供直觀，交互豐富，可高度個性化定制的數據可視化圖表。
ECharts官網：http://echarts.baidu.com/index.html 對於ECharts的介紹、文檔以及教程等都做了比較詳細
的說明，下面是一個Springboot下的小demo：
1.下載所需js工具包，官網 http://echarts.baidu.com/download.html 提供常用、精簡、完成、源代碼四種
工具包，可根據自己需求具體下載（此demo用的是源代碼工具包）
2.idea上新建一個Springboot項目，結構如下：
3.application.properties
server.port=8082 #視圖處理的配置 spring.mvc.view.prefix=/ spring.mvc.view.suffix=.html
4. test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
<!-- 引入 echarts.js -->
<script type="text/javascript" src="/js/echarts.js"></script>
</head>
<body>
<!-- 為ECharts准備一個具備大小（寬高）的Dom -->
<div id="main" style="width: 1000px;height:400px;"></div>
<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: [30.6, 30.0, 28.2, 27.8, 27.6, 27.0,27.0,26.5,25.5,25.0]
}]
};
// 使用剛指定的配置項和數據顯示圖表。
myChart.setOption(option);
// myChart.setOption({
// series : [
// {
// name: '訪問來源',
// type: 'pie',
// radius: '55%',
// data:[
// {value:235, name:'視頻廣告'},
// {value:274, name:'聯盟廣告'},
// {value:310, name:'郵件營銷'},
// {value:335, name:'直接訪問'},
// {value:400, name:'搜索引擎'}
// ]
// }
// ]
// })
</script>
</body>
</html>
5.TestController
@Controller public class TestController { @RequestMapping("/testEcharts") public String test(){ return "test"; } }
6.啟動項目，訪問：http://localhost:8082/testEcharts
7.代碼地址：https://github.com/liuchunbo24/Springboor-Echarts-Demo