销售排行榜这么做:Power BI绝对值和占比组合图

2022-05-19 08:43:44 浏览数 (1)

偶然间在网上看到一个研发费用图表,同时显示了各大公司的研发花费以及研发费用占营收的比例。个人认为这个图表非常实用,可以广泛应用于零售业各环节。比如,店铺销售排行榜和对公司的整体业绩贡献,产品销售排行榜和毛利贡献……

以下是Power BI的模拟效果。为了节约画布空间,对原图进行了少许优化:将占比直接显示在圆形气泡上。

可以应用到商品管理领域:

这个图表可以使用DAX一个度量值生成。在写度量值之前,我们需要庖丁解牛般分解该图表的元素。

该图表的主体部分从左往右分为6大块:公司Logo、条形、绝对值数据标签、直线、气泡、占比数据标签。

公司Logo可以在度量值中使用image标签,条形使用rect标签,直线使用line标签,数据标签使用text标签,气泡使用circle标签。

完整度量值如下,将该度量值放入视觉对象HTML Conten正常显示,将度量值中的[value]和[value%]替换为你的模型指标,可以复用。

代码语言:javascript复制
绝对值占比组合图 = 
//logo20像素宽,条形100像素宽,直线长度150像素,上下间距18像素,圆圈最大半径6像素
VAR ItemCount =
    DISTINCTCOUNT ( 'Table'[公司] )
VAR MaxValue =
    MAXX ( VALUES ( 'Table'[公司] ), [Value] )
VAR MaxPercent =
    MAXX ( VALUES ( 'Table'[公司] ), [Value%] )
VAR BarTable =
    ADDCOLUMNS (
        SUMMARIZE (
'Table',
'Table'[公司],
'Table'[logo],
"Index", RANKX ( ALLSELECTED ( 'Table' ), [Value] )
        ),
"Image",//画logo
"<image xlink:href='" & [logo] & "' x='0' y='" & ( [Index] - 1 ) * 18 & "' width='19' height='12'/>",
"Rect",//画条形
"<rect x='20' y='" & ( [Index] - 1 ) * 18 & "' width='" & 100 * [Value] / MaxValue & "' height='12' fill='CornflowerBlue'/>",
"Text",//画绝对值数据标签
"<text x='" & 20   100 * [Value] / MaxValue - 1 & "' y='" & ( [Index] - 1 ) * 18   8 & "'  text-anchor='end' font-size='6' >"
                & ROUND ( [Value], 1 ) & "</text>",
"Line",//画连接横线
"<Line x1='20' y1='" & ( [Index] - 1 ) * 18   6 & "' x2='170' y2='" & ( [Index] - 1 ) * 18   6 & "' stroke='Grey' stroke-width='0.1'/>",
"Circle",//画气泡
"<Circle cx='170' cy='" & ( [Index] - 1 ) * 18   6 & "' r='"
                & SQRT ( 36 * [Value%] / MaxPercent ) & "' fill='CornflowerBlue' fill-opacity='0.95'/>",
"Label%",//画占比数据标签                           公众号:wujunmin
"<text x='170' y='" & ( [Index] - 1 ) * 18   7 & "'  text-anchor='middle' font-size='4' >"
                & ROUND ( [Value%] * 100, 0 ) & "%</text>"
    )
VAR Bar =
    CONCATENATEX (
        BarTable,
        [Line] & [Rect] & [Text] & [Image] & [Circle] & [Label%]
    )
VAR SVG = "<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 176 " & 18 * ItemCount & "'>" & Bar & "</svg>"
RETURN
    SVG

0 人点赞