[[408887]]

本文轉(zhuǎn)載自微信公眾號「尤而小屋」，作者Peter  。轉(zhuǎn)載本文請聯(lián)系Peter的公眾號。

認識漏斗圖

漏斗圖是網(wǎng)站銷售領域一種十分常用的圖表，主要是用來分析在各個階段的流失和轉(zhuǎn)化情況。比如在某個商城中，我們統(tǒng)計用戶在不同階段的人數(shù)來分析轉(zhuǎn)化率：

• 商城UV：商城每天的訪問人數(shù)
• 搜索人數(shù)：在商城有過搜索行為的用戶數(shù)
• 加購人數(shù)：有加購行為的用戶數(shù)
• 提交訂單：有多少用戶提交訂單
• 點擊支付：提交訂單之后有多少用戶點擊支付按鈕
• 支付成功：最終支付成功的用戶數(shù)

從搜索人數(shù)開始到支付成功，每個階段用戶都存在一定的流失，漏斗圖就能很好地將這種流失和轉(zhuǎn)化情況顯示出來。

除去柱狀圖、餅圖、折線圖，漏斗圖應該是自己在工作畫的最為頻繁的一種圖表。下面我們通過模擬某個電商網(wǎng)站的用戶行為來繪制漏斗圖。

整體效果

看一個漏斗圖的整體效果：

視頻

導入庫

基于兩種方式實現(xiàn)：

• plotly_express ：px
• plotly.graph_objects：go

import pandas as pd 
import numpy as np 
 
# plotly兩個繪圖接口 
import plotly_express  as px 
import plotly.graph_objects as go 

基于px實現(xiàn)

基礎漏斗圖

模擬一份商城數(shù)據(jù)：

data1 = pd.DataFrame({ 
    "number": [1200,900,700,400,180,100], 
    "stage": ["瀏覽網(wǎng)站","搜索","加購","提交訂單","點擊支付","支付成功"]} 
) 
data1 

繪制一個基礎漏斗圖：

# 繪圖 
fig = px.funnel( 
    data1,  # 待繪圖數(shù)據(jù) 
    x="number",  # x軸的數(shù)據(jù) 
    y="stage"  # y軸的數(shù)據(jù) 
) 
 
fig.show() 

我們還可以加上一個顏色參數(shù)color：

# 加上顏色參數(shù)color 
 
fig = px.funnel( 
  data1, 
  x="number", 
  y="stage", 
  color="number"  # 顏色參數(shù) 
) 
 
fig.show() 

如果我們的顏色設置成number列，用數(shù)值意義似乎不準確，更好地應該是不同的階段表示，換成stage：

# 加上顏色參數(shù)color 
 
fig = px.funnel( 
  data1, 
  x="number", 
  y="stage", 
  color="stage"   # ?。?！改成stage 
) 
 
fig.show() 

看生成的漏斗圖：最上面的是支付成功，通常我們希望的是數(shù)值最大的在最上面，于是我們將傳入的數(shù)據(jù)翻轉(zhuǎn)一下：

# 加上顏色參數(shù)color 
 
fig = px.funnel( 
  data1[::-1],   # ?。?！數(shù)據(jù)翻轉(zhuǎn) 
  x="number", 
  y="stage", 
  color="stage"   # ?。?！改成stage 
) 
 
fig.show() 

分組漏斗

分組漏斗表示的含義將不同組別的漏斗圖放在一個畫布中，比如：看今年3月和2020年3月的數(shù)據(jù)對比情況，這叫做同比

同比：相同時期的對比，比如：2021年3月和2020年3月

環(huán)比：相鄰時期的對比，比如：2021年3月和2021年2月

1、2020年3月份數(shù)據(jù)

2、2021年3月份數(shù)據(jù)

3、使用concat函數(shù)合并兩組數(shù)據(jù)

4、繪制漏斗圖

# 繪圖 
 
fig = px.funnel(df3,x="number",y="stages",color="time") 
fig.show() 

繪制面積漏斗圖

還是使用最上面的數(shù)據(jù)：

fig = px.funnel_area( 
    data1, 
    names = "stage", 
    values = "number", 
) 
 
fig.show() 

我們觀察到：面積漏斗圖默認繪制的百分比，而普通漏斗圖是數(shù)值

基于go實現(xiàn)

繪制基礎漏斗圖

from plotly import graph_objects as go 
 
fig = go.Figure(go.Funnel( 
    x=[1000,800,400,100], 
    y=["瀏覽網(wǎng)站","加購","點擊支付","支付成功"] 
)) 
 
fig.show() 

改變漏斗圖的顏色和邊框

from plotly import graph_objects as go 
 
fig = go.Figure(go.Funnel( 
    x=[1000,800,400,100],  # 數(shù)據(jù) 
    y=["瀏覽網(wǎng)站","加購","點擊支付","支付成功"], # 每個階段的名稱 
    textposition = "inside",  #  文本位置：['inside', 'outside', 'auto', 'none']  
    textinfo = "value + percent initial",   # 顯示文本信息 ['label', 'text', 'percent initial', 'percent previous', 'percent total', 'value'] 前面選項的任意組合 
    opacity = 0.65,  
    marker = {"color": ["deepskyblue", "lightsalmon", "tan", "silver"], 
              "line": {"width": [4, 2, 3, 1, 1],  
                       "color": ["wheat", "wheat", "blue", "yellow"]}}, 
    connector = {"line": {"color": "royalblue", "dash": "dot", "width": 3}}) 
    ) 
 
fig.show() 

我們需要注意textinfo參數(shù)的使用，它有3種使用方式：

• percent initial：相對于初始值
• percent previous：相對于前一個值
• percent total：相對于整體數(shù)值

上面這個漏斗圖使用的是percent initial(相對于初始值)，百分比是這樣來的：

1000/1000 = 100% 
800 / 1000 = 80% 
400 / 1000 = 40% 
100 / 1000 = 10% 

如果是percent previous：

1000/1000 = 100% 
800 / 1000 = 80% 
400 / 800 = 50% 
100 / 400 = 25% 

如果是percent total：

我們看看第一個百分比是如何計算的：

分組漏斗

from plotly import graph_objects as go 
 
stage = ["瀏覽網(wǎng)站","加購","點擊支付","支付成功"] 
 
fig = go.Figure() 
 
fig.add_trace(go.Funnel( 
    name = "2020年3月",  # 圖形軌跡名稱 
    x = [1000,800,400,200],  # 數(shù)據(jù) 
    y = stage, # 每個階段名稱 
    orientation = "h",  # 方位 
    textposition = "inside",  # 文本內(nèi)容的位置 
    textinfo = "value+percent previous"  # 顯示文本內(nèi)容 
)) 
 
 
fig.add_trace(go.Funnel( 
    name = "2021年2月",   # 名稱和數(shù)據(jù)需要改變 
    x = [1200,900,500,240],   
    y = stage,  
    orientation = "h",   
    textposition = "inside",   
    textinfo = "value+percent total"   
)) 
 
fig.add_trace(go.Funnel( 
    name = "2021年3月",  # 名稱和數(shù)據(jù)需要改變 
    x = [1500,1000,450,300],   
    y = stage,  
    orientation = "h",   
    textposition = "inside",   
    textinfo = "label+percent initial"   
)) 
 
 
fig.show() 

在上面的圖中，既可以觀察到同比情況(2020年3月和2021年3月)，也可以觀察到環(huán)比情況(2021年3月和2月)

面積漏斗

from plotly import graph_objects as go 
 
fig = go.Figure(go.Funnelarea( 
    text = ["瀏覽網(wǎng)站","加購","點擊支付","支付成功"], 
    values = [5000, 2000, 800, 500], 
 
)) 
 
fig.show() 

設置面積漏斗的顏色和邊框

from plotly import graph_objects as go 
 
fig = go.Figure(go.Funnelarea( 
    values = [3000, 2000, 800, 500],  
    text = ["瀏覽網(wǎng)站","加購","點擊支付","支付成功"], 
    marker = {"colors": ["deepskyblue", "lightsalmon", "teal", "silver"],  # 顏色 
              "line": {"color": ["red", "blue", "wheat", "wheat"],   # 邊框顏色和線條寬度 
                       "width": [0, 1, 3, 5]}}, 
    textfont = {"family": "Old Standard TT, serif", "size": 13,   # 字體設置 
                "color": "black"},  
    opacity = 0.65))  # 透明度 
fig.show() 

多組面積漏斗

不同組別的漏斗圖我們也可以分開放，將它們放在一個大的畫布中：

from plotly import graph_objects as go 
 
fig = go.Figure() 
 
# 添加四組數(shù)據(jù)：第一季度到第四季度 
fig.add_trace(go.Funnelarea( 
    scalegroup = "first",   # 組別名稱 
    text = ["瀏覽網(wǎng)站","搜索","加購","提交訂單","點擊支付","支付成功"], 
    values = [500, 450, 340, 230, 220, 110],  # 數(shù)據(jù) 
    textinfo = "value",  # 顯示文本信息 
    title = {"position": "top center",  # 標題頂部居中 
             "text": "第一季度"  # 標題內(nèi)容 
            }, 
    domain = {"x": [0, 0.5], # 圖形位置 
              "y": [0, 0.5] 
             })) 
 
fig.add_trace(go.Funnelarea( 
    scalegroup = "first",  
    text = ["瀏覽網(wǎng)站","搜索","加購","提交訂單","點擊支付","支付成功"], 
    values = [600, 500, 400, 300, 200, 100],  
    textinfo = "value", 
    title = {"position": "top center",  
             "text": "第二季度"}, 
    domain = {"x": [0, 0.5],  
              "y": [0.55, 1]})) 
 
fig.add_trace(go.Funnelarea( 
    scalegroup = "second",  
    text = ["瀏覽網(wǎng)站","搜索","加購","提交訂單","點擊支付","支付成功"], 
    values = [510, 480, 440, 330, 220, 100],  
    textinfo = "value", 
    title = {"position": "top left",  
             "text": "第三季度"}, 
    domain = {"x": [0.55, 1],  
              "y": [0, 0.5]})) 
 
fig.add_trace(go.Funnelarea( 
    scalegroup = "second",  
    text = ["瀏覽網(wǎng)站","搜索","加購","提交訂單","點擊支付","支付成功"], 
    values = [360, 250, 240, 130, 120, 60], 
    textinfo = "value",  
    title = {"position": "top right",  
             "text": "第四季度"}, 
    domain = {"x": [0.55, 1],  
              "y": [0.55, 1]})) 
 
fig.update_layout( 
    margin = {"l": 100, "r": 100},   # 整個圖形到左右邊框的距離 
    shapes = [ 
            {"x0": 0, "x1": 0.5, "y0": 0, "y1": 0.5},   # 添加4組位置 
            {"x0": 0, "x1": 0.5, "y0": 0.55, "y1": 1}, 
            {"x0": 0.55, "x1": 1, "y0": 0, "y1": 0.5}, 
            {"x0": 0.55, "x1": 1, "y0": 0.55, "y1": 1} 
    ]) 
 
fig.show() 

漏斗圖真的很好用，能夠觀察到數(shù)據(jù)在不同階段的轉(zhuǎn)化情況。