項目中引入和使用Echart的方法


1.首先在項目pom.xml文件中增加依賴。

<!--echarts圖表集start-->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>echarts</artifactId>
<version>3.8.5</version>
</dependency>
<!--echarts圖表集end-->

2.在HTML文件中定義一個div用來接收展示圖表。

<div id="div" style="height:500px;width: 800px;"></div>

3.在JS文件中定義一個圖標文件,並初始化。

var myChart = echarts.init(document.getElementById('div'));

4.在JS文件中定義編寫圖表的數據代碼,echart官網有各種案例。

var option = {
  ... ...
};

5.在JS文件中為圖表對象加載數據。

myChart.setOption(option);

6.在HTML文件中引入對應的js代碼。

<script th:src="@{/js/charts.js}"></script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM