Conditional formatting on dynamic formatting options

[WouterBo]

Hi,

I would like to know if, using custom visuals API 3.5.1, it is possible to apply conditional formatting to dynamic formatting options. By dynamic formatting options I mean options that are added to the formatting pane as the user adds values to the visual. For instance the data colours that are added to the Funnel visual:

As you can see here, conditional formatting is available only for the (statically named) "Default color" and not for any of the dynamically added values.

Currently, my capabilities.json file contains this for data colors:

        "dataColors": {
            "displayName": "Data colors",
            "displayNameKey": "Visual_DataColors",
            "properties": {
                "fill": {
                    "displayName": "Data color",
                    "displayNameKey": "Visual_DataColor",
                    "type": {
                        "fill": {
                            "solid": {
                                "color": true
                            }
                        }
                    }
                }               
            }
        },

And my settings.ts file contains this:

export class dataColorsSettings {
  public fill: string = null;
}

When I enumerate my data colors object instance, I add any dynamically added values like so:

   private enumerateDataColors(valueColumns: DataViewMetadataColumn[], instanceEnumeration: VisualObjectInstanceEnumeration): VisualObjectInstance[] {
        if (!(<VisualObjectInstanceEnumerationObject>instanceEnumeration).instances) {
            return;
        }

        let instances = (<VisualObjectInstanceEnumerationObject>instanceEnumeration).instances;

        for (let v = 0; v < valueColumns.length; v++) {
            const displayName = valueColumns[v].displayName;
            const selector: ISelectionId = this.host.createSelectionIdBuilder()
                .withMeasure(valueColumns[v].queryName)
                .createSelectionId();
            this.addAnInstanceToEnumeration(instanceEnumeration, {
                displayName,
                objectName: Visual.dataColorsPropertyIdentifier.objectName,
                selector: ColorHelper.normalizeSelector(selector.getSelector(), false),
                properties: {
                    fill: { solid: { color: this.viewModel.valuesColor[v] } }
                }
            });

            let obj = {}
            obj[displayName] = VisualEnumerationInstanceKinds.ConstantOrRule;
            instances[0].selector = dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesOnly);
            instances[0].altConstantValueSelector = null;
            instances[0].propertyInstanceKind = obj
        }

        delete instances[0].properties['fill'];

        return <VisualObjectInstance[]>instanceEnumeration;
    }

While this does add a correct looking propertyInstanceKind object to instances[0], no conditional formatting options appear in the formatting pane.

Since I have not been able to spot a native visual that has conditional formatting for dynamically added values, I'm ready to assume it's simply not supported at the moment. 

Can it be done?

[v-rzhou-msft]

Hi @WouterBo 

Do you want to use conditional formatting in Funnel visual? "Show all" function is to show all lengeds and let you select colors manually. If you want to show differents colors by date, you can try to build a color measure and add this measure into fx in default color. 

My Sample:

Color Measure:

Measure = 
SWITCH(MAX('Table'[Date]),DATE(2021,10,30),"Blue",DATE(2021,12,04),"Yellow","Green")

Click fx , Format by Field value and use Measure.

Result is as blow.

Best Regards,

Rico Zhou

If this post helps, then please consider Accept it as the solution to help the other members find it more quickly. 

[WouterBo]

Thanks Rico,

"I would like to know if  ... it is possible to apply conditional formatting to dynamic formatting options."

I'm making a custom visual. Funnel is only an example to show what I mean.

Add dynamic options based on values.

Add conditional formatting to dynamically generated formatting options.

Can it be done?

[v-rzhou-msft]

Hi @WouterBo 

Conditional formatting is now supported in API 3.5 and above 

It seem that Power BI  supports you to add conditional formatting in default color currently.

Blog:

Support for conditional formatting for custom visuals

Add conditional formatting

I think you can try to build a measure as I show above and add it into fx in default color to change the color of fields in your custom visual. It can be more complex and dynamic.

Best Regards,

Rico Zhou

If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.