Echarts 漏斗图
實(shí)例:
- 本節(jié)任務(wù)
任務(wù)一:漏斗圖或金字塔圖
- 任務(wù)描述
漏斗圖(funnel)是倒三角形的條形圖,金字塔是正三角形的條形圖,這兩者適用于業(yè)務(wù)流程比較規(guī)范、周期較長(zhǎng)、環(huán)節(jié)較多的流程分析。漏斗圖也是常用的BI類圖表之一,用戶通過漏斗圖或金字塔對(duì)各環(huán)節(jié)業(yè)務(wù)數(shù)據(jù)進(jìn)行比較,不僅能夠直觀地發(fā)現(xiàn)和說明問題而且可以根據(jù)圖分析銷售各環(huán)節(jié)中哪些環(huán)節(jié)出了問題。為了更直觀地查看電商網(wǎng)站數(shù)據(jù),需要在Echarts中繪制基本漏斗圖、基本金字塔、多漏斗圖和多金字塔進(jìn)行展示。
????漏斗圖又稱倒三角圖,漏斗圖將數(shù)據(jù)呈現(xiàn)為幾個(gè)階段,每個(gè)階段的數(shù)據(jù)都是整體的一部分;從一個(gè)階須到另一個(gè)階段,數(shù)據(jù)占比自上而下下降,所有階段數(shù)據(jù)的占比總計(jì)100%。與餅圖一樣,漏斗圖呈現(xiàn)的也不是具體的數(shù)據(jù)。此外,漏斗圖還具有不需要使用任何數(shù)據(jù)軸的特點(diǎn)。
案例描述:
?????在電商網(wǎng)站中,一個(gè)完整的網(wǎng)上購(gòu)物步驟大致為:瀏覽選購(gòu)——添加到購(gòu)物車——購(gòu)物車結(jié)算——核對(duì)訂單信息——提交訂單——選擇支付方式——完成支付。某電商網(wǎng)站各購(gòu)物步驟的數(shù)據(jù)如下:
| 所處環(huán)節(jié) | 當(dāng)前人數(shù) | 整體轉(zhuǎn)化率 |
| 瀏覽選購(gòu) | 1000 | 100% |
| 添加到購(gòu)物車 | 600 | 60% |
| 購(gòu)物車結(jié)算 | 420 | 42% |
| 核對(duì)訂單信息 | 25 | 25% |
| 提交訂單 | 90 | 9% |
| 選擇支付方式 | 40 | 4% |
| 完成支付 | 25 | 2.5% |
- 實(shí)現(xiàn)步驟
引入echarts.js庫(kù)文件
定義圖表容器大小
初如化echarts實(shí)例對(duì)象
配置圖表組件
-
主要參數(shù)講解
- 知識(shí)拓展
提示:sort取descending是漏斗,取ascending是金字塔。
總結(jié)
以上是生活随笔為你收集整理的Echarts 漏斗图的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 如何以身作则,做孩子的榜样
- 下一篇: C语言中delay的用法