第一步：下載下傳echarts.js，将其解壓到項目下
Echarts官網
第二步：建立echarts.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
</head>
<body>
<!-- 為ECharts準備一個具備大小（寬高）的Dom -->
<div id="main" style="height:400px"></div>
</body>
第三步：引入echarts.js
<script type="text/javascript" src="./echarts-2.2.7/build/source/echarts.js"></script>
<script type="text/javascript">
// 路徑配置
require.config({
paths: {
echarts: './echarts-2.2.7/build/dist'
}
});
</script>
第四步 動态加載要使用的圖表
<script type="text/javascript">
// 路徑配置
require.config({
paths: {
echarts: './echarts-2.2.7/build/dist'
}
});
require(
[
'echarts',
'echarts/chart/line', // 按需加載所需圖表，如需動态類型切換功能，别忘了同時加載相應圖表
'echarts/chart/bar'
],
function (ec) {
var myChart = ec.init(document.getElementById('main'));
var option = {
...
}
myChart.setOption(option);
}
);
</script>
第五步：選擇你要用什麼圖表
這裡我選擇了标準折線圖
點進去可以看到它的執行個體option
把它的option拷貝到自己的html裡，就可以用了
實際項目中，圖表的屬性和資料根據需求去設定就好了，可以參照它的執行個體去改，換成自己想要的就行了
不懂參數的話看Echarts參考手冊