Echarts配置項(xiàng)

title標(biāo)題

legend圖例

grid直角坐標(biāo)系內(nèi)繪圖網(wǎng)

xAxis直角坐標(biāo)系 grid 中的 x 軸

yAxis直角坐標(biāo)系 grid 中的 y 軸

polar極坐標(biāo)系

radiusAxis極坐標(biāo)系的徑向軸

angleAxis極坐標(biāo)系的角度軸

radar雷達(dá)圖坐標(biāo)系組件

dataZoom區(qū)域縮放

visualMap 是視覺映射組件

tooltip提示框組件

axisPointer這是坐標(biāo)軸指示器(axisPointer)的全局公用設(shè)置

toolbox工具欄。內(nèi)置有導(dǎo)出圖片數(shù)據(jù)視圖,動(dòng)態(tài)類型切換數(shù)據(jù)區(qū)域縮放重置五個(gè)工具。

brush是區(qū)域選擇組件

geo地理坐標(biāo)系組件

parallel平行坐標(biāo)系介紹

parallelAxis這個(gè)組件是平行坐標(biāo)系中的坐標(biāo)軸

singleAxis單軸??梢员粦?yīng)用到散點(diǎn)圖中展現(xiàn)一維數(shù)據(jù).

timeline提供了在多個(gè) ECharts option 間進(jìn)行切換、播放等操作的功能

graphic 是原生圖形元素組件

  1. 可以支持的圖形元素包括:
    image, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,

calendar日歷坐標(biāo)系組件

dataset數(shù)據(jù)集組件

aria支持無障礙富互聯(lián)網(wǎng)應(yīng)用規(guī)范集的組件(WAI-ARIA)

series正八經(jīng)的圖的繪制的方法

一下不同的圖的區(qū)別都是體現(xiàn)在相同的series屬性下的type上

series-line折線/面積圖

series-bar柱狀圖

series-pie餅圖

  1. 環(huán)形圖環(huán)內(nèi)字體設(shè)置
emphasis: {
                label: {
                    show: true,
                    fontSize: '40',
                    fontWeight: 'bold'
                }
            },

series-scatter散點(diǎn)(氣泡)圖

series-effectScatter帶有漣漪特效動(dòng)畫的散點(diǎn)(氣泡)圖

series-radar雷達(dá)圖

浮層圖

...
tooltip{
  trigger:"axis"  //觸發(fā)器類型
}
...
series: [
          {
            name: "事件等級(jí)",
            type: "radar",
            tooltip: {
              trigger: "item",//觸發(fā)器內(nèi)容
            },
]
...

series-tree 樹圖

series-treemap它主要用面積的方式,便于突出展現(xiàn)出『樹』的各層級(jí)中重要的節(jié)點(diǎn)

series-sunburst旭日?qǐng)D(Sunburst)由多層的環(huán)形圖組成

series-boxplot分散情況資料的統(tǒng)計(jì)圖

中文可以稱為『箱形圖』、『盒須圖』、『盒式圖』、『盒狀圖』、『箱線圖』,是一種用作顯示一組數(shù)據(jù)分散情況資料的統(tǒng)計(jì)圖。它能顯示出一組數(shù)據(jù)的最大值、最小值、中位數(shù)、下四分位數(shù)及上四分位數(shù)。

series-candlestick K線圖

series-heatmap熱力圖

series-map地圖

series-parallel平行坐標(biāo)系的系列

series-lines路徑圖

series-graph關(guān)系圖

series-sankey?;鶊D

series-funnel漏斗圖

series-gauge儀表盤

series-pictorialBar象形柱圖

series-themeRiver是一種特殊的流圖, 它主要用來表示事件或主題等在一段時(shí)間內(nèi)的變化

series-custom自定義系列

darkMode是否是暗黑模式

color調(diào)色盤顏色列表。如果系列沒有設(shè)置顏色,則會(huì)依次循環(huán)從該列表中取顏色作為系列顏色

默認(rèn):['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']

backgroundColor背景色,默認(rèn)無背景

textStyle全局的字體樣式

animation是否開啟動(dòng)畫

animationThreshold是否開啟動(dòng)畫的閾值,當(dāng)單個(gè)系列顯示的圖形數(shù)量大于這個(gè)閾值時(shí)會(huì)關(guān)閉動(dòng)畫

animationDuration初始動(dòng)畫的時(shí)長,支持回調(diào)函數(shù),可以通過每個(gè)數(shù)據(jù)返回不同的時(shí)長實(shí)現(xiàn)更戲劇的初始動(dòng)畫效果

animationEasing初始動(dòng)畫的緩動(dòng)效果。不同的緩動(dòng)效果可以參考 緩動(dòng)示例。

animationDelay初始動(dòng)畫的延遲,支持回調(diào)函數(shù),可以通過每個(gè)數(shù)據(jù)返回不同的 delay 時(shí)間實(shí)現(xiàn)更戲劇的初始動(dòng)畫效果。

animationDurationUpdate數(shù)據(jù)更新動(dòng)畫的時(shí)長

animationEasingUpdate數(shù)據(jù)更新動(dòng)畫的緩動(dòng)效果

animationDelayUpdate數(shù)據(jù)更新動(dòng)畫的延遲

支持回調(diào)函數(shù),可以通過每個(gè)數(shù)據(jù)返回不同的 delay 時(shí)間實(shí)現(xiàn)更戲劇的更新動(dòng)畫效果。

stateAnimation狀態(tài)切換的動(dòng)畫配置,支持在每個(gè)系列里設(shè)置單獨(dú)針對(duì)該系列的配置。

blendMode圖形的混合模式

圖形的混合模式,不同的混合模式見 https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation 。

默認(rèn)為 'source-over' 。 支持每個(gè)系列單獨(dú)設(shè)置。

'lighter' 也是比較常見的一種混合模式,該模式下圖形數(shù)量集中的區(qū)域會(huì)顏色疊加成高亮度的顏色(白色)。常常能起到突出該區(qū)域的效果。見示例 全球飛行航線

hoverLayerThreshold圖形數(shù)量閾值,決定是否開啟單獨(dú)的 hover 層,在整個(gè)圖表的圖形數(shù)量大于該閾值時(shí)開啟單獨(dú)的 hover 層。

useUTC是否使用 UTC 時(shí)間。

options用于 timeline 的 option 數(shù)組。數(shù)組的每一項(xiàng)是一個(gè) echarts option ( ECUnitOption )

media移動(dòng)端自適應(yīng)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容