建站
咨詢
售后
建站咨詢
新聞中心
象形柱圖在 ECharts 系列中使用series[i]-pictorialBar表示，它利用圖片和形狀表現(xiàn)數(shù)據(jù)，具體來說它既可以用圖形的長寬變形表現(xiàn)數(shù)據(jù)，也可以用圖形的個(gè)數(shù)、甚至是圖形的顏色、透明度變化表現(xiàn)數(shù)據(jù)。
成都創(chuàng)新互聯(lián)于2013年創(chuàng)立，是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司，擁有項(xiàng)目網(wǎng)站制作、成都網(wǎng)站建設(shè)網(wǎng)站策劃，項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢想脫穎而出為使命，1280元秦淮做網(wǎng)站,已為上家服務(wù),為秦淮各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:028-86922220
象形柱圖是可以設(shè)置各種具象圖形元素（如圖片、SVG PathData 等）的柱狀圖。往往用在信息圖中。用于有至少一個(gè)類目軸或時(shí)間軸的直角坐標(biāo)系上。
在下面的這個(gè)例子中，右邊的兩座山分別是一個(gè)圖片，而最左側(cè)的紙是由多個(gè)圖片堆加成的，象形柱圖會(huì)根據(jù)它們所在系列對應(yīng)的數(shù)值，決定其高度。配合動(dòng)畫效果，能夠?qū)崿F(xiàn)很好的視覺效果，效果圖如下，您可以點(diǎn)擊圖片下方的鏈接來編輯該實(shí)例：
點(diǎn)擊編輯實(shí)例 》》
象形柱圖布局
象形柱圖可以被想象為：它首先是個(gè)柱狀圖，但是柱狀圖的柱子并不顯示。這些柱子我們稱為『基準(zhǔn)柱（reference bar）』，根據(jù)基準(zhǔn)柱來定位和顯示各種象形圖形（包括圖片）。
每個(gè)象形圖形根據(jù)基準(zhǔn)柱的定位，是通過 symbolPosition、symbolOffset 來調(diào)整其于基準(zhǔn)柱的相對位置。
參見例子：
點(diǎn)擊編輯實(shí)例 》》
可以使用 symbolSize 調(diào)整大小，從而形成各種視圖效果。
參見例子：
點(diǎn)擊編輯實(shí)例 》》
象形圖形類型
每個(gè)圖形可以配置成『單獨(dú)』和『重復(fù)』兩種類型，即通過 symbolRepeat 來設(shè)置。
- 設(shè)置為 false（默認(rèn)），則一個(gè)圖形來代表一個(gè)數(shù)據(jù)項(xiàng)。
- 設(shè)置為 true，則一組重復(fù)的圖形來代表一個(gè)數(shù)據(jù)項(xiàng)。
參見例子：
點(diǎn)擊編輯實(shí)例 》》
每個(gè)象形圖形可以是基本圖形（如 'circle', 'rect', ...）、SVG PathData、圖片，參見：symbolType。
參見例子：
點(diǎn)擊編輯實(shí)例 》》
可以使用 symbolClip 對圖形進(jìn)行剪裁。
參見例子：
點(diǎn)擊編輯實(shí)例 》》
象形柱圖使用實(shí)例
圣誕節(jié)快到了，您可以使用象形柱圖方便地實(shí)現(xiàn)以下這個(gè)馴鹿和交通方式的速度對比圖。下圖包含兩個(gè)系列，一個(gè)是顯示在上方的交通方式矢量圖標(biāo)，象形柱圖默認(rèn)會(huì)將每個(gè)圖標(biāo)放在對應(yīng)值所在位置的下方，通過 symbolSize 指定圖標(biāo)大??；另一個(gè)系列是顯示在圖標(biāo)下方的山峰，在不指定 symbolSize 的情況下，將填充滿所在的“柱子”，因而就有了圖示效果：
點(diǎn)擊編輯實(shí)例 》》
除此之外，象形柱圖還可以用同一圖形的個(gè)數(shù)表現(xiàn)數(shù)值，實(shí)現(xiàn)類似 ECharts 圣誕活動(dòng)頁中一群小精靈的效果。
網(wǎng)站名稱：創(chuàng)新互聯(lián)ECharts教程：ECharts象形柱圖
鏈接地址：http://www.5511xx.com/article/ccsihdh.html
