1、簡介
ECharts是百度的一個項目，后來百度把Echart捐給apache，用于圖表展示，提供了常規的折線圖、柱狀圖、散點圖、餅圖、K線圖，用于統計的盒形圖，用于地理數據可視化的地圖、熱力圖、線圖，用于關系數據可視化的關系圖、treemap、旭日圖，多維數據可視化的平行坐標，還有用于 BI 的漏斗圖，儀表盤，并且支持圖與圖之間的混搭。
官方網站：https://echarts.apache.org/examples/zh/

入門參考：官網->文檔->教程->5分鐘上手ECharts
（1）創建html頁面：柱圖.html
（2）引入ECharts

<!-- 引入 ECharts 文件 --> <script src="echarts.min.js"></script>

（3）定義圖表區域

<!-- 為ECharts準備一個具備大小（寬高）的Dom --> <div id="main" style="width: 600px;height:400px;"></div>

（4）渲染圖表

<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>

效果圖：

3、折線圖
實例參考：官網->實例->官方實例 https://echarts.baidu.com/examples/
折線圖.html

<script>var myChart = echarts.init(document.getElementById('main'));var option = {//x軸是類目軸（離散數據）,必須通過data設置類目數據xAxis: {type: 'category',data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']},//y軸是數據軸（連續數據）yAxis: {type: 'value'},//系列列表。每個系列通過 type 決定自己的圖表類型series: [{//系列中的數據內容數組data: [820, 932, 901, 934, 1290, 1330, 1320],//折線圖type: 'line'}]};myChart.setOption(option);</script>

鏈接：https://pan.baidu.com/s/1AmW-Fv5nEDTbR45zIxvpVA
提取碼：7pnt

總結

以上是生活随笔為你收集整理的echartsdemo可视化统计（笔记分享）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。