共用方式為

新增條件式格式設定

  • 發行項

設定格式化的條件可讓報表建立者根據數值指定色彩在報表中的顯示方式。

此文章說明如何將「設定格式化的條件」功能新增到您的 Power BI 視覺效果。

目前，條件式格式設定只能套用至色彩。

將「設定格式化的條件」新增到您的專案

此節說明如何將「設定格式化的條件」新增到現有的 Power BI 視覺效果。 此文章中的範例程式碼是以 SampleBarChart \(英文\) 視覺效果為基礎。 您可以在 barChart.ts \(英文\) 中檢查原始程式碼。

在 [格式] 窗格中新增條件式色彩格式化項目

在此節中，您會了解如何將條件式色彩格式化項目新增至 [格式] 窗格中的資料點。

  1. 使用 VisualObjectInstance 中的 propertyInstanceKind 陣列，其是由 powerbi-visuals-api 公開。 確認您的檔案包含此匯入：

    import powerbiVisualsApi from "powerbi-visuals-api";

  2. 若要指定適當的格式化類型 (Constant、ConstantOrRule 或 Rule)，請使用 VisualEnumerationInstanceKinds 列舉。 將下列匯入新增到您的檔案：

    import VisualEnumerationInstanceKinds = powerbiVisualsApi.VisualEnumerationInstanceKinds;

  3. 設定格式化屬性執行個體種類

若要將支援條件式格式設定的屬性格式化，請在其 descriptor 中設定所需的執行個體種類。

 public getFormattingModel(): powerbi.visuals.FormattingModel {
    // ...
    formattingGroup.slices.push(
        {
            uid: `colorSelector${barDataPoint_indx}_uid`,
            displayName: barDataPoint.category,
            control: {
                type: powerbi.visuals.FormattingComponent.ColorPicker,
                properties: {
                    descriptor: {
                        objectName: "colorSelector",
                        propertyName: "fill",                
                        selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals),
                        altConstantValueSelector: barDataPoint.selectionId.getSelector(),
                        instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule // <=== Support conditional formatting
                    },
                    value: { value: barDataPoint.color }
                }
            }
        }
    );
    // ...
 }

VisualEnumerationInstanceKinds.ConstantOrRule 會同時建立條件式格式設定 UI 項目與常數格式化 UI 元素。

在 Power BI 中顯示之條件式格式設定按鈕的螢幕擷取畫面，其位於一般色彩按鈕旁邊。

定義「設定格式化的條件」的行為

定義如何將格式化套用至您的資料點。

使用在 powerbi-visuals-utils-dataviewutils 底下宣告的 createDataViewWildcardSelector，指定是否將條件式格式設定套用至執行個體、總計或兩者皆是。 如需詳細資訊，請參閱 DataViewWildcard。

針對您要套用條件式格式設定的屬性做出下列變更：

  • 以 dataViewWildcard.createDataViewWildcardSelector(dataViewWildcardMatchingOption) 呼叫取代 selector 值。 DataViewWildcardMatchingOption 會定義「設定格式化的條件」是要套用到例項、總計或兩者。

  • 搭配先前針對 selector 屬性所定義的值來新增 altConstantValueSelector 屬性。

針對支援條件式格式設定的格式化屬性，請在其 descriptor 中設定所需的執行個體種類。

 
 public getFormattingModel(): powerbi.visuals.FormattingModel {
    // ...

    formattingGroup.slices.push(
        {
            uid: `colorSelector${barDataPoint_indx}_uid`,
            displayName: barDataPoint.category,
            control: {
                type: powerbi.visuals.FormattingComponent.ColorPicker,
                properties: {
                    descriptor: {
                        objectName: "colorSelector",
                        propertyName: "fill",                
                        // Define whether the conditional formatting will apply to instances, totals, or both
                        selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals),

                        // Add this property with the value previously defined for the selector property
                        altConstantValueSelector: barDataPoint.selectionId.getSelector(),

                        instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule
                    },
                    value: { value: barDataPoint.color }
                }
            }
        }
    );

    // ...
 }

考量與限制

下列視覺效果不支援條件式格式設定：

  • 資料表型視覺效果

  • 矩陣型視覺效果

我們建議您不要對資料數列使用條件式格式設定。 而是應該允許客戶將每個資料數列個別格式化，從而以視覺化方式輕鬆區分資料數列。 大部分現成可用的視覺效果與資料數列都共用此方法。

相關內容

DataViewUtils