欢迎光临散文网 会员登陆 & 注册

Power BI自定义条形图的填充效果

2023-05-10 11:53 作者:wujunmin  | 我要投稿

Power BI内置的条形图略显乏味,只能填充各种颜色,本文试图突破这一限制,将条形图填充为各种形状或者图片。如下是模拟的几种效果:


实现方式是DAX嵌入SVG图形编码,一个度量值即可生成上图中的一种效果,条形填充内容可以是任意图形。以下对制作过程进行简要介绍。


1. 实现原理


以填充圆形为例,度量值如下:

<defs>定义了一个圆(circle标签设置的圆心在5, 5坐标,半径为4的红色圆形),圆的名字叫wu,这个圆并不会在图表中显示,而是用来被后续引用。

<defs>中的pattern标签使得定义的圆被平铺。

被平铺填充的对象是一个长方形,由rect标签定义,这个长方形宽度为100,高度为10(略大于圆的直径)。

<defs>可以比作印章,你只会刻一枚印章,但是却可以印在无数文件上。rect相当于你要盖章的文件。

上方的度量值中要盖章的文件只是一个长方形,你可以同时为多个文件盖章:

度量值中嵌入三个长方形都引用名称为wu的圆:


上图是长度一样的三个条形,将条形长度动态变化即可实现我们需要的自定义填充条形图。


2. 制作印章


如何制作印章,即如何定义<defs>?这里提供三种方案。


第一种纯代码法,例如上文定义了一个圆,圆心的位置、半径、填充色为参数。

这种方法适用于简单的图形,还可以是圆形、正方形、三角形、五角星等。太过复杂的图形考验人的SVG功底,对SVG不太熟悉的读者不建议使用此方法。


第二种网络资源利用法,网上有丰富的SVG图标资源,例如https://www.iconfont.cn/

选中需要的图标,点击复制SVG代码,放入你的<defs>中,注意复制的代码需要掐头去尾,只保留中间的核心内容。


第二种方法的制约在于,图片都是别人的,选择仍然有限,无法满足使用需求。这个时候需要祭出PPT大法。


将需要的图形导入到PPT中,鼠标右键另存为SVG,记事本打开该SVG,复制代码到你的<defs>中。



这种方法本质上是将其他格式的图片转换为SVG格式,再内嵌到度量值。有读者可能会有疑问,为什么一定要转换成SVG代码,<defs>里面不能直接内嵌jpg、png吗?


答案是可以的。但是Power BI目前没有合适的载体展示这一功能,所以暂时不可用。直接使用jpg, png需要使用别的SVG方案,目前不适合这种盖章法。



3. 完整度量值


以下给出文章开头的示例样式(填充圆形)度量值,读者可举一反三:


Power BI自定义条形图的填充效果的评论 (共 条)

分享到微博请遵守国家法律