---

title: API

說明： required 標(biāo)簽代表生成圖表的必選配置項(xiàng)，optional 標(biāo)簽代表生成圖表的可選配置項(xiàng)。

data: collection

required

數(shù)據(jù)源為對(duì)象集合，例如：[{ action: '瀏覽網(wǎng)站', pv: 50000 }, { action: '放入購(gòu)物車', pv: 35000 }, { action: '生成訂單', pv: 25000 }]。

xField: string

required

漏斗條目對(duì)應(yīng)的數(shù)據(jù)字段名，一般對(duì)應(yīng)一個(gè)分類字段。

yField: string

required

漏斗數(shù)值對(duì)應(yīng)的數(shù)據(jù)字段名，一般對(duì)應(yīng)一個(gè)離散字段。

dynamicHeight: boolean

設(shè)置漏斗數(shù)值映射關(guān)系。false 數(shù)值大小映射到漏斗形狀寬度，視覺上呈現(xiàn)為定高度變角度的漏斗圖。true 數(shù)值大小映射到漏斗圖形高度，視覺上呈現(xiàn)為定角度變高度的漏斗圖。

默認(rèn)為 false。

dynamicHeight: false	dynamicHeight: true

transpose: boolean

optional

設(shè)置布局方式，false 為垂直布局，true 為水平布局，默認(rèn)為 false。

transpose: false	transpose: true

compareField: string

optional

對(duì)比漏斗圖必選。

數(shù)據(jù)集中的對(duì)比字段名，一般對(duì)應(yīng)一個(gè)分類字段。

通過該字段值，漏斗圖將會(huì)被分成兩組，通過左右鏡像位置區(qū)分，視覺上呈現(xiàn)為對(duì)比漏斗圖。

注意，由于對(duì)比漏斗圖左右圖形對(duì)稱布局，數(shù)值大小只能映射在漏斗形狀寬度，所以啟動(dòng) compareField 時(shí) dynamicHeight 設(shè)置 true 將無效。

例如 代碼演示 中以 quarter 作為對(duì)比字段進(jìn)行兩個(gè)季度數(shù)據(jù)的比較。

compareText

optional

配置對(duì)比漏斗圖位于側(cè)方的分類文案樣式及顯示。

visible: boolean: 是否顯示分類文案

offsetX: number: 分類文案相對(duì)漏斗圖形左側(cè)沿 x 方向的偏移量，僅在水平布局有效

offsetY: number: 分類文案相對(duì)漏斗圖形上側(cè)沿 y 方向的偏移量，僅在垂直布局有效

style: object: 分類文案樣式

percentage

optional

配置轉(zhuǎn)化率樣式及內(nèi)容。在漏斗圖中，轉(zhuǎn)化率展示由 固定線段、固定文案、數(shù)值文案 3 個(gè)部分組成，樣式及內(nèi)容可以分別通過 percentage.line、percentage.text、percentage.value 配置。

visible: boolean 是否顯示轉(zhuǎn)化率

line.visible: boolean 是否顯示固定線段

line.style: object 固定線段樣式

text.visible: boolean 是否顯示固定文案

text.style: object 固定文案樣式

text.content: string 固定文案內(nèi)容

value.visible: boolean 是否顯示數(shù)值文案

value.style: object 數(shù)值文案樣式

value.formatter: (yValueUpper, yValueLower) => string 數(shù)值文案內(nèi)容

offsetX: number? 在當(dāng)前位置基礎(chǔ)上再往 x 方向的偏移量

offsetY: number? 在當(dāng)前位置基礎(chǔ)上再往 Y 方向的偏移量

spacing: number 固定線段、固定文本、數(shù)值文案之間的間隔

funnelStyle: object | function

optional

配置漏斗單個(gè)圖形樣式。

總結(jié)

以上是生活随笔為你收集整理的漏斗图的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。