Freigeben über

Hinzufügen von bedingter Formatierung

  • Artikel

Mit bedingter Formatierung kann ein Berichtersteller angeben, wie Farben in einem Bericht gemäß einem numerischen Wert angezeigt werden.

In diesem Artikel wird beschrieben, wie Sie die Funktion der bedingten Formatierung Ihrem Power BI-Visual hinzufügen können.

Die bedingte Formatierung kann nur auf die folgenden Eigenschaftstypen angewendet werden:

  • Farbe
  • Text
  • Symbol
  • Web-URL

Hinzufügen bedingter Formatierung zu Ihrem Projekt

In diesem Abschnitt wird gezeigt, wie Sie einem vorhandenen Power BI-Visual bedingte Formatierung hinzufügen. Der Beispielcode in diesem Artikel basiert auf dem Visual SampleBarChart. Sie können den Quellcode in barChart.ts untersuchen.

Hinzufügen eines Eintrags für die bedingte Farbformatierung im Bereich „Format“

In diesem Abschnitt erfahren Sie, wie Sie einem Datenpunkt im Bereich „Format“ einen Eintrag für die bedingte Farbformatierung hinzufügen.

  1. Verwenden Sie das Array propertyInstanceKind in VisualObjectInstance, das von powerbi-visuals-api verfügbar gemacht wird. Vergewissern Sie sich, dass Ihre Datei diesen Import enthält:

    import powerbiVisualsApi from "powerbi-visuals-api";

  2. Um den richtigen Formatierungstyp (Constant, ConstantOrRule oder Rule) anzugeben, verwenden Sie die VisualEnumerationInstanceKinds-Enumeration. Fügen Sie Ihrer Datei den folgenden Import hinzu:

    import VisualEnumerationInstanceKinds = powerbiVisualsApi.VisualEnumerationInstanceKinds;

  3. Festlegen der Instanzart für die Formatierungseigenschaft

Wenn Sie Eigenschaften formatieren möchten, die bedingte Formatierung unterstützen, legen Sie die erforderliche Instanzart in ihrem descriptor fest.

 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 erstellt den Benutzeroberflächeneintrag für die bedingte Formatierung neben dem Benutzeroberflächenelement für die konstante Formatierung.

Screenshot der Schaltfläche für die bedingte Formatierung, wie sie in Power BI neben der regulären Farbschaltfläche angezeigt wird.

Definieren des Verhaltens der bedingten Formatierung

Definieren Sie, wie die Formatierung auf die Datenpunkte angewendet werden soll.

Geben Sie mit dem unter powerbi-visuals-utils-dataviewutils deklarierten createDataViewWildcardSelector an, ob die bedingte Formatierung auf Instanzen, Gesamtergebnisse oder beides angewendet werden soll. Weitere Informationen finden Sie unter DataViewWildcard.

Nehmen Sie die folgenden Änderungen an den Eigenschaften vor, auf die die bedingte Formatierung angewendet werden soll:

  • Ersetzen Sie den Wert selector durch den dataViewWildcard.createDataViewWildcardSelector(dataViewWildcardMatchingOption)-Aufruf. DataViewWildcardMatchingOption definiert, ob bedingte Formatierung auf Instanzen, Gesamtergebnisse oder beides angewendet wird.

  • Fügen Sie die altConstantValueSelector-Eigenschaft mit dem zuvor für die Eigenschaft selector definierten Wert hinzu.

Legen Sie für Formatierungseigenschaften, die die bedingte Formatierung unterstützen, die erforderliche Instanzart in ihrem descriptor fest.

 
 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 }
                }
            }
        }
    );

    // ...
 }

Überlegungen und Einschränkungen

Die bedingte Formatierung wird für die folgenden visuellen Elemente nicht unterstützt:

  • Tabellenbasierte visuelle Elemente

  • Matrixbasierte visuelle Elemente

Es wird empfohlen, die bedingte Formatierung nicht mit Reihen zu verwenden. Stattdessen sollten Sie es Kunden ermöglichen, jede Reihe einzeln zu formatieren, sodass Sie die Reihen problemlos visuell unterscheiden können. Die meisten standardmäßigen visuellen Elemente mit Datenreihen teilen diesen Ansatz.

Zugehöriger Inhalt

DataViewUtils