Power BI 文字圆形背景函数

wujunmin

发布于 2025-11-17 17:43:33

590

文章被收录于专栏：wujunminwujunmin

支持中文、字母、数字等任意文本，并且可自动换行，效果：

函数语法为：

HTML_CircleBG_Text(文本内容,背景色,文字颜色)

比如数值指标展示：

度量值 =

HTML_CircleBG_Text(

FORMAT([M.指标],"0.0"),

"white",

"rgb(17,141,255)")

该度量值放入HTML Content视觉对象即可正常显示，颜色可以是英文颜色名称或RGB。

如何在你的模型应用？

首先，确保Power BI Desktop是2025年9月及以后的版本，如果不是，安装包地址：

https://www.microsoft.com/zh-cn/download/details.aspx?id=58494

打开文件-选项和设置-选项-预览功能，勾选“DAX用户自定义函数”：

切换到DAX查询视图，粘贴以下代码，点击右上角的使用更改更新模型即生效。

DEFINE
FUNCTION HTML_CircleBG_Text= 
(AnyText:string,BackgroundColor:string,TextColor:string)=>
"<head>
  <style>
    p {
        font-size: 30px;
        color: white;
        font-weight: bold;
        line-height: 1;
        font-family: Arial, sans-serif;
    }    
    .wujunmin {
        background-color: " & BackgroundColor & ";
        border-radius: 50%;
        margin: 3px;
        width: 60px;
        height: 60px;
        color: " & TextColor & ";
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
  </style>
</head>
<body>
  <p>" & 
    CONCATENATEX(
        GENERATESERIES(1,LEN(AnyText)),
        "<span class='wujunmin'>" & MID(AnyText,[Value],1) & "</span>",,[Value],ASC
    ) & "</p>
</body>"

按照本文开头的方法，新建度量值，引用该函数即可。我在以下网址存放了众多的Power BI SVG/HTML图表函数，大家可以选择使用。