Power BI 模拟VisActor子弹进度图

wujunmin

发布于 2024-01-24 16:37:26

1840

发布于 2024-01-24 16:37:26

文章被收录于专栏：wujunminwujunmin

之前介绍过VisActor可视化库，本文开始第一个模仿：子弹图，效果如下图所示，条形为实际值，红色的图标像一个图钉，为目标值：

在表格矩阵视觉对象，可以创建一个SVG图表度量值实现以上效果，度量值如下：

visactor子弹图 = 
//公众号、知乎、B站：wujunmin
VAR MaxAC =
    MAXX ( ALLSELECTED ( '店铺资料'[店铺名称] ), [M.销售业绩] )
VAR MaxPL =
    MAXX ( ALLSELECTED ( '店铺资料'[店铺名称] ), [M.销售目标] )
VAR MaxValue =
    MAX ( MaxAC, MaxPL )
VAR Rect_Width = 180 * [M.销售业绩] / MaxValue
VAR Line_X = 180 * [M.销售目标] / MaxValue
VAR Rect_Color =
    IF ( [M.销售业绩] >= [M.销售目标], "deepskyblue", "lightgrey" )
VAR SVG = "
    data:image/svg+xml;utf8,
    <svg xmlns='http://www.w3.org/2000/svg' width='200' height='30' >
        <line 
            x1='0' x2='" & Line_X & "' 
            y1='15' y2='15'
            stroke-width='2' stroke='lightgrey' stroke-dasharray='3'
        />
        <rect 
            x='0' y='10' rx='5'
            width='" & Rect_Width & "' height='10' 
            fill='" & Rect_Color & "'
        />
        <line 
            x1='" & Line_X & "' x2='" & Line_X & "' 
            y1='10' y2='20'
            stroke-width='2' stroke='red'
        />
        <path d='M" & Line_X & " 10L" &  Line_X - 8 & " 4 " &  Line_X + 8 & " 4Z' fill='red'/>
    </svg>"
RETURN
    SVG

把度量值中的业绩和目标替换为你模型中的指标即可复用，将度量值拖入表格矩阵时，需要设置为图像URL：