天天看點

Power BI添加動态水印

基于權限控制需求可能想在Power BI頁面添加水印。靜态水印使用路徑成本生成一個卡片圖即可,本文講解動态水印的制作及使用。

  1. 動态水印示範

頂部水準水印如下圖所示,淡灰色的wujunmin在向右移動:

Power BI添加動态水印

傾斜重複水印如下圖所示:

Power BI添加動态水印

原地轉圈水印,如下圖左上角:

Power BI添加動态水印

轉大圈水印,圓圈其實不需要,隻是為了輔助讓大家看到行動軌迹:

Power BI添加動态水印

神出鬼沒水印,看似随機的在移動:

Power BI添加動态水印

2. 制作水印

水印使用路徑成本生成,原理是SVG的動畫标簽,将水印的文字替換為自己需要的,可以重複使用。

水印_頂部水準 = 
 "<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 1280 20'>
<text x='0' y='20' font-size='20' fill='Grey' fill-opacity='0.4' text-anchor='middle'>wujunmin
<animate attributeName='x' from='0' by='1280' begin='0s' dur='30s' repeatCount='indefinite' />
</text>
</svg> "           

複制

viewbox設定的螢幕顯示寬度高度,可依據自己的畫布尺寸靈活調整。

水印_重複傾斜 = 
VAR label = "wujunmin" //水印内容
VAR Label_Count = 10 //水印行數
VAR t =
    GENERATESERIES ( 1, Label_Count )
VAR t_text =
    ADDCOLUMNS (
        t,
        "tspan",
            "<tspan x='0' y='" & [Value] * 5 & "'>" & label & "
<animate attributeName='x' from='"
                & IF ( MOD ( [Value], 2 ) = 0, 0, Label_Count * 5 ) & "' by='"
                & IF (
                    MOD ( [Value], 2 ) = 0,
                    SQRT ( 2 ) * Label_Count * 5,
                    -1 * SQRT ( 2 ) * Label_Count * 5
                ) & "' begin='"
                & RANDBETWEEN ( 0, 10 ) & "s' dur='10s' repeatCount='indefinite' />
</tspan>"
    )
VAR SVG =
    "<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 " & Label_Count * 5 & " " & Label_Count * 5 & "'>
<g transform='rotate(-45," & Label_Count * 5 & "," & Label_Count * 5 & ")'>
<text font-size='5' fill='Grey' fill-opacity='0.2' text-anchor='middle' dominant-baseline='middle'>"
        & CONCATENATEX ( t_text, [tspan] ) & "
</text>
</g>
</svg> "
RETURN
    SVG           

複制

水印_原地轉圈 = 
"<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 100 100'>
<text x='50' y='50' font-size='20' fill='Grey' fill-opacity='0.4' text-anchor='middle'>wujunmin
<animatetransform attributeName='transform' type='rotate' from='0 50 50' to='360 50 50' begin='0s' dur='30s' repeatCount='indefinite' />
</text>
</svg> "           

複制

水印_轉大圈 = 
"<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 100 100'>
<text x='0' y='0' font-size='5' fill='Grey' fill-opacity='0.4' text-anchor='middle'>
        wujunmin
<animatemotion path='M0 50a50 50 0 1 0 100 0a50 50 0 1 0 -100 0z' begin='0s' dur='20s' repeatCount='indefinite' />
    </text>
</svg> "           

複制

神出鬼沒水印讀者可以自定義移動路徑,自定義的方式為:

搜尋引擎搜尋SVG線上編輯(功能都差不多),任意打開一個編輯器,如下操作:

Power BI添加動态水印

記事本打開儲存好的SVG檔案,将裡面的path内容複制到上方的水印-轉大圈路徑成本,移動路徑則重新規劃成功。

3. 顯示水印

顯示上方路徑成本做好的水印有三種方式。第一種是使用HTML Content視覺對象,将以上路徑成本放入該視覺對象即可正常顯示。

Power BI添加動态水印

注意為避免對圖表造成遮擋,需要将加載水印的HTML Content置于底層:

Power BI添加動态水印

使用HTML Content的好處是可以和Power BI模型中的使用者權限設定産生關聯,且支援的動畫形式相對較多。壞處是消耗一定的記憶體及硬碟。

第二種是将以上路徑成本的<SVG></SVG>部分儲存成外部SVG檔案,使用添加頁面背景的方式導入Power BI:

Power BI添加動态水印

這種SVG檔案很小,隻有幾個KB,加載迅速,移動絲滑,但是支援的動畫相對基礎,也無法和模型産生關聯。

第三種和第二種類似,針對單個圖表添加水印,可以繪圖區單獨導入SVG檔案:

Power BI添加動态水印