提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

Power BI 图表空心化

2023-02-18 16:27:08 时间

本公众号已经分享了超过百种DAX+SVG自定义的图表，本文介绍如何将自定义图表空心化。所谓空心图表是指没有填充颜色，仅有边框颜色的图表。下图展示了条形图的空心效果：

该图表度量值如下，把度量值放入HTML Content视觉对象正常显示。这个度量值的关键在于，把前期介绍的实心条形图中的fill参数改为none，也就是没有颜色，然后添加stroke参数，stroke进行颜色定义。

空心-条形 = 
VAR MaxValue =
    MAXX ( ALLSELECTED( '店铺资料'[城市] ), [M.销售业绩])        
VAR SVG = 
"<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 102 6.5' >
<rect rx='2' x='1' y='0.2' width='" & 100*[M.销售业绩]/ MaxValue & "' height='6' fill='none' stroke='DarkCyan' stroke-width='0.2'/>
<text x='2' y='4.5'  text-anchor='start' font-size='3'>" & SELECTEDVALUE('店铺资料'[城市]) & "</text>
</svg>"
RETURN
    SVG

任何使用SVG自定义的图表都可以利用这一原理进行改造，例如下图的空心气泡条件格式：

度量值如下，把度量值放入表格、矩阵对应字段的条件格式图标即可正常显示：

以上演示表明，形状可以空心化，文字是否也可以呢？可以的，效果如下：

度量值如下，度量值放入HTML Content视觉对象进行显示。

Fill none stroke color，SVG空心的原理就这么简单。读者可以尝试将本公众号前期分享的各种自定义图表改造成空心的。

比如麦肯锡的旋转正方形：

比如复合图表：

全家福：

相关文章