新聞中心
timeline.checkpointStyle | Object
當前項(checkpoint)的圖形樣式。

timeline.checkpointStyle.symbol | string
[ default: 'circle' ]
timeline.checkpointStyle 標記的圖形。
ECharts 提供的標記類型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
也可以通過 'image://url' 設置為圖片,其中 url 為圖片的鏈接,或者 dataURI。
可以通過 'path://' 將圖標設置為任意的矢量路徑。這種方式相比于使用圖片的方式,不用擔心因為縮放而產(chǎn)生鋸齒或模糊,而且可以設置為任意顏色。路徑圖形會自適應調(diào)整為合適的大小。路徑的格式參見 SVG PathData??梢詮?Adobe Illustrator 等工具編輯導出。
timeline.checkpointStyle.symbolSize | number, Array
[ default: 13 ]
timeline.checkpointStyle 標記的大小,可以設置成諸如 10 這樣單一的數(shù)字,也可以用數(shù)組分開表示寬和高,例如 [20, 10] 表示標記寬為20,高為10。
timeline.checkpointStyle.symbolRotate | number
timeline.checkpointStyle 標記的旋轉(zhuǎn)角度。
注意在 markLine 中當 symbol 為 'arrow' 時會忽略 symbolRotate 強制設置為切線的角度。
timeline.checkpointStyle.symbolOffset | Array
[ default: [0, 0] ]
timeline.checkpointStyle 標記相對于原本位置的偏移。
默認情況下,標記會居中置放在數(shù)據(jù)對應的位置,但是如果 symbol 是自定義的矢量路徑或者圖片,就有可能不希望 symbol 居中。這時候可以使用該配置項配置 symbol 相對于原本居中的偏移,可以是絕對的像素值,也可以是相對的百分比。
例如 [0, '50%'] 就是把自己向上移動了一半的位置,在 symbol 圖形是氣泡的時候可以讓圖形下端的箭頭對準數(shù)據(jù)點。
timeline.checkpointStyle.color | Color
[ default: '#c23531' ]
時間軸組件中當前項(checkpoint)的顏色。
timeline.checkpointStyle.borderWidth | number
[ default: 5 ]
時間軸組件中當前項(checkpoint)的邊框?qū)挾取?/p>
timeline.checkpointStyle.borderColor | Color
[ default: 'rgba(194,53,49, 0.5)' ]
時間軸組件中當前項(checkpoint)的邊框顏色。
timeline.checkpointStyle.animation | boolean
[ default: true ]
時間軸組件中當前項(checkpoint)在 timeline 播放切換中的移動,是否有動畫。
timeline.checkpointStyle.animationDuration | number
[ default: 300 ]
時間軸組件中當前項(checkpoint)的動畫時長。
timeline.checkpointStyle.animationEasing | string
[ default: 'quinticInOut' ]
時間軸組件中當前項(checkpoint)的動畫的緩動效果。不同的緩動效果可以參考 緩動示例。
本文名稱:創(chuàng)新互聯(lián)ECharts教程:ECharts當前項的圖形樣式
瀏覽路徑:http://www.dlmjj.cn/article/cceooss.html


咨詢
建站咨詢
