Bagikan melalui

Menambahkan pemformatan bersyarat

  • Artikel

Pemformatan bersyarat memungkinkan pembuat laporan menentukan bagaimana warna ditampilkan dalam laporan, menurut nilai numerik.

Artikel ini menjelaskan cara menambahkan fungsionalitas pemformatan bersyarat ke visual Power BI Anda.

Saat ini, pemformatan bersyarat hanya dapat diterapkan ke warna.

Menambahkan pemformatan bersyarat ke proyek Anda

Bagian ini menunjukkan cara menambahkan pemformatan bersyarat ke visual Power BI yang sudah ada. Contoh kode dalam artikel ini didasarkan pada visual SampleBarChart. Anda dapat memeriksa kode sumber di barChart.ts.

Menambahkan entri pemformatan warna bersyarat di panel format

Di bagian ini Anda mempelajari cara menambahkan entri pemformatan warna bersyarat, ke titik data di panel format.

  1. propertyInstanceKind Gunakan array di VisualObjectInstance, yang diekspos oleh powerbi-visuals-api. Verifikasi bahwa file Anda menyertakan impor ini:

    import powerbiVisualsApi from "powerbi-visuals-api";

  2. Untuk menentukan jenis pemformatan yang sesuai (Konstanta, ConstantOrRule, atau Aturan), gunakan VisualEnumerationInstanceKinds enum. Tambahkan impor berikut ke file Anda:

    import VisualEnumerationInstanceKinds = powerbiVisualsApi.VisualEnumerationInstanceKinds;

  3. Mengatur jenis instans properti pemformatan

Untuk memformat properti yang mendukung pemformatan bersyarat, atur jenis instans yang diperlukan di .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 membuat entri antarmuka pengguna pemformatan bersyarat bersama elemen antarmuka pengguna pemformatan konstan.

Cuplikan layar tombol pemformatan bersyarat, seperti yang muncul di Power BI, di samping tombol warna biasa.

Menentukan perilaku pemformatan bersyarat

Tentukan bagaimana pemformatan diterapkan ke titik data Anda.

Menggunakan createDataViewWildcardSelector dideklarasikan di bawah powerbi-visuals-utils-dataviewutils, tentukan apakah akan menerapkan pemformatan bersyarat ke instans, total, atau keduanya. Untuk informasi selengkapnya, lihat DataViewWildcard.

Buat perubahan berikut pada properti yang ingin Anda terapkan pemformatan bersyaratnya:

  • Ganti nilai selector dengan panggilan dataViewWildcard.createDataViewWildcardSelector(dataViewWildcardMatchingOption). DataViewWildcardMatchingOption menentukan apakah pemformatan bersyarat diterapkan ke instans, total, atau keduanya.

  • Tambahkan properti altConstantValueSelector dengan nilai yang sebelumnya ditentukan untuk properti selector.

Untuk memformat properti yang mendukung pemformatan bersyarat, atur jenis instans yang diperlukan di 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 }
                }
            }
        }
    );

    // ...
 }

Pertimbangan dan batasan

Pemformatan bersyarat tidak didukung untuk visual berikut:

  • Visual berbasis tabel

  • Visual berbasis matriks

Kami menyarankan agar Anda tidak menggunakan pemformatan bersyarat dengan seri. Sebagai gantinya, Anda harus mengizinkan pelanggan untuk memformat setiap seri satu per satu, sehingga mudah untuk membedakan secara visual antar seri. Sebagian besar visual out-of-the-box dengan seri, berbagi pendekatan ini.

Konten terkait

DataViewUtils