Power BI 自定义长文本显示路径

世界上绝大多数事物都不是横平竖直的，Power BI使用几行度量值也可以让文本不再死板的横平竖直，而是按任意路径显示，原理是DAX+SVG。

本文的教程支持内置表格矩阵、新卡片图和各种支持SVG的第三方视觉对象（比如HTML Content），以下以HTML Content讲解（该视觉对象对SVG的语法要求宽松，如需内置视觉对象显示注意代码加上前缀及命名空间）。

首先看原型：

M.路径文本原型 = "
<svg viewBox='0 0 200 200'>
    <defs><path id='wujunmin' d='文本路径'/></defs>
    <text font-size='16'>
        <textPath xlink:href='#wujunmin'>
            文本内容
        </textPath>
    </text>
</svg>"

<defs>中定义文本需要显示的路径，<text>定义需要显示的内容。接下来转入实战，绘制一个直角造型的文本：

M.路径文本原型2 = "
<svg viewBox='0 0 200 200'>
    <defs><path id='wujunmin' d='M0 50L150 50 150 200'/></defs>
    <text font-size='23'>
        <textPath xlink:href='#wujunmin'>
            wujunmin Power BI SVG
        </textPath>
    </text>
</svg>"

显示效果如下：

文本发生直角拐弯的原因是<path>绘制了一个直角，如果把上方的path显示出来，可以看到：

接下来进一步实战，自定义一个造型，且文本内容为度量值，可以动态变化。

第一步、定义造型。搜索一个SVG在线编辑器（长相都差不多），输入宽度和高度参数（本例为600*200），宽度和高度是由两个因素确定的：你想把这段文本放在报表的什么地方显示多大，以及你的文字走向想要什么造型。

确定好宽度高度后，在左侧选择画笔，画出你的路径走向。在视图-源代码中看到绘制路径的SVG代码，找到<path>中的"d=",复制"d="后双引号中间的内容。

把该内容粘贴到上方的原型度量值文本路径处。度量值中SVG开头的viewbox宽度高度和SVG在线编辑器的参数保持一致。

第二、编辑文本内容。把各指标（或者别的内容）串联，并用Format格式化：

将度量值放入HTML Content即可正常显示。

SVG的<text>有众多的参数对文本格式化，上方的度量值只定义了字号Font Size，其他的加粗、颜色、倾斜等网上资料很多，可以参考《Power BI SVG制图入门知识》查看推荐的站点。

配套资料在文末知识星球提供

应用时灵活拓展，一个度量值可以指定多段文本多个路径。