Power BI 卡片图边框数据化

wujunmin

发布于 2025-02-10 16:37:56

6100

代码可运行

文章被收录于专栏：wujunminwujunmin

运行总次数：0

代码可运行

这是一个普通的带有边框的卡片图：

如果是美化目的，可以借助空心图片灵活设计边框，参考：Power BI卡片图异形边框

本文讨论的不是边框的美化，而是边框的数据化。

第一种数据化方式是，边框颜色使用fx随指标大小变化，比如业绩达成绿色边框，未达成红色边框。

在新卡片图视觉对象，如下施加颜色度量值：

颜色.达成 = IF ( [M.业绩达成率] >=1, "green","red" )

第二种方式是强调栏颜色变化，相当于四个方向的边框只改变一个边：

强调栏施加fx：

更多强调栏技巧：Power BI 卡片图强调栏应用情境

第三种是把边框当成拐弯的进度条图表。这种需要将系统默认的边框去除，使用DAX结合SVG进行边框重构。

度量值只有10行，把度量值中的业绩达成率换成你的百分比指标。

SVG.边框式进度条.指标 = 
VAR Pct = IF([M.业绩达成率]>=1,1,[M.业绩达成率])
VAR Color = IF([M.业绩达成率]>=1,"green","red")
RETURN
"data:image/svg+xml;utf8,
<svg xmlns='http://www.w3.org/2000/svg' width='200' height='100'>
<path d='M0 0 L200 0 200 100 0 100Z' fill='none' stroke='lightgrey' stroke-width='10' />
<path d='M0 0 L200 0 200 100 0 100Z' fill='none' stroke='" & Color & "' stroke-width='10' stroke-dasharray='" & 600 * Pct & " " & 600-600* Pct & "'/><text x='100' y='50' font-size='30' text-anchor='middle'>"& FORMAT([M.业绩达成率],"0%") & "
</text><text x='100' y='80' font-size='16' text-anchor='middle' fill='grey'>业绩达成率</text>
</svg>"

如果是新卡片图使用，把以上度量值放入图像URL：