2019/10

echarts.js的應用及使用方法

發布時間：2019-10-31 16:21:23

發布者：等等

瀏覽量:

下午好，這是山東文匯信息服務官網，由于最近參與的項目，接觸、熟悉了一款數據可視化工具,就是一款純Javascript的圖表庫。

Echarts--商業級數據圖表

商業級數據圖表，它是一個純JavaScript的圖標庫，兼容絕大部分的瀏覽器，底層依賴輕量級的canvas類庫ZRender，提供直觀，生動，可交互，可高度個性化定制的數據可視化圖表。創新的拖拽重計算、數據視圖、值域漫游等特性大大增強了用戶體驗，賦予了用戶對數據進行挖掘、整合的能力。

echarts的優點：
1.國人開發，文檔全，便于開發和閱讀文檔。

山東濟南文匯app開發，系統開發，微信小程序開發.png

2.圖表豐富，可以適用各種各樣的功能。
echarts的缺點：
沒有，或者說沒發現......

echarts不失為一款比較適合我們這種碼農使用的框架。
echarts就不貼代碼了。因為是中國朋友開發的，所以文檔很全。

濟南app開發公司提醒您使用方法如下：

1、引入 ECharts 文件

為 ECharts 準備一個具備大小（寬高）的 DOM元素

在script里面設置

 
    // 基于準備好的dom，初始化echarts實例
    var myChart = echarts.init(document.getElementById('main'));
 
    中間放 指定圖表的配置項和數據
    也就是拷貝過來的js代碼，就可以啦
     
    // 使用剛指定的配置項和數據顯示圖表。
    myChart.setOption(option); 
    設置完畢之后，就是這樣的。

設置完畢之后，就是這樣的。

山東濟南文匯app開發，系統開發，微信小程序開發.png