echarts學習總結

ECharts學習總結
使用步驟
1 引入ECharts <script src="echarts.min.js"></script>
2 繪製一個簡單的圖表
  爲ECharts準備具有寬高的DOM容器
  而後就能夠經過 echarts.init 方法初始化一個 echarts 實例並經過 setOption 方法生成一個簡單的柱狀圖

//基於準備好的dom,初始化echarts實例
var myChart=echarts.init(document.getElementById('main'));
//指定圖表的配置和數據
var option={
    title:{
        text:'ECharts 入門示例'
    },
    tooltip:{}, //提示
    legend:{ //圖例
        data:['銷量']
    },
    xAxis:{ //座標軸
        data:["襯衫","羊絨衫","洗衣機","高跟鞋","褲子","雪紡衫"]
    },
    yAxis:{},
    series:[{ //數據系列  type 表示什麼形狀的圖形
        name:'hahha',type:'bar',data:[2,5,20,37,100,107]
    }]
};
//使用剛指定的配置頂好和數據顯示圖集。
myChart.setOption(option);

名詞解析
基本名詞
  名詞   描述
  chart    是指一個完整的圖表，如折線圖，餅圖等「基本」圖表類型或由基本圖表組合而成的「混搭」圖表，可能包括座標軸、圖例等
  axis 直角座標系中的一個座標軸，座標軸可分爲類目型、數值型或時間型
  xAxis    直角座標系中的橫軸，一般並默認爲類目型
  yAxis    直角座標系中的縱軸，一般並默認爲數值型
  grid 直角座標系中除座標軸外的繪圖網格，用於定義直角系總體佈局
  legend   圖例，表述數據和圖形的關聯
  dataRange    值域選擇，經常使用於展示地域數據時選擇值域範圍
  dataZoom 數據區域縮放，經常使用於展示大量數據時選擇可視範圍
  roamController   縮放漫遊組件，搭配地圖使用
  toolbox  輔助工具箱，輔助功能，如添加標線，框選縮放等
  tooltip  氣泡提示框，經常使用於展示更詳細的數據
  timeline 時間軸，經常使用於展示同一系列數據在時間維度上的多份數據
  series   數據系列，一個圖表可能包含多個系列，每個系列可能包含多個數據
圖表名詞
line   折線圖，堆積折線圖，區域圖，堆積區域圖。
bar        柱形圖（縱向），堆積柱形圖，條形圖（橫向），堆積條形圖。
scatter    散點圖，氣泡圖。散點圖至少須要橫縱兩個數據，更高維度數據加入時能夠映射爲顏色或大小，當映射到大小時則爲氣泡圖
k      K線圖，蠟燭圖。經常使用於展示股票交易數據。
pie    餅圖，圓環圖。餅圖支持兩種（半徑、面積）南丁格爾玫瑰圖模式。
radar  雷達圖，填充雷達圖。高維度數據展示的經常使用圖表。
chord  和絃圖。經常使用於展示關係數據，外層爲圓環圖，可體現數據佔比關係，內層爲各個扇形間相互鏈接的弦，可體現關係數據
force  力導佈局圖。經常使用於展示覆雜關係網絡聚類佈局。
map        地圖。內置世界地圖、中國及中國34個省市自治區地圖數據、可經過標準GeoJson擴展地圖類型。支持svg擴展類地圖應用，如室內地圖、運動場、物件構造等。
heatmap    熱力圖。用於展示密度分佈信息，支持與地圖、百度地圖插件聯合使用。
gauge  儀表盤。用於展示關鍵指標數據，常見於BI類系統。
funnel 漏斗圖。用於展示數據通過篩選、過濾等流程處理後發生的數據變化，常見於BI類系統。
evnetRiver 事件河流圖。經常使用於展現具備時間屬性的多個事件，以及事件隨時間的演化。
treemap    矩形式樹狀結構圖，簡稱：矩形樹圖。用於展現樹形數據結構，優點是能最大限度展現節點的尺寸特徵。
venn   韋恩圖。用於展現集合以及它們的交集。
tree   樹圖。用於展現樹形數據結構各節點的層級關係
wordCloud  詞雲。詞雲是關鍵詞的視覺化描述，用於彙總用戶生成的標籤或一個網站的文字內容

radius 半徑