Forum Discussion

Pumayk26's avatar
Pumayk26
Frequent Visitor
6 years ago

Custom visual formating not showing in power bi

I have added objects value as below. But these options not appearing in power bi

"objects": {
        "circle": {
            "displayName": "Circle",
            "properties": {
                "circleColor": {
                    "displayName": "Color",
                    "description": "The fill color of the circle.",
                    "type": {
                        "fill": {
                            "solid": {
                                "color": true
                            }
                        }
                    }
                },
                "circleThickness": {
                    "displayName": "Thickness",
                    "description": "The circle thickness.",
                    "type": {
                        "numeric": true
                    }
                }
            }
        }
    }
Need Help

1 Reply

  • dm-p's avatar
    dm-p
    Icon for Super User rankSuper User
    6 years ago

    Hi Pumayk26,

    If you're adding objects, you also need code to instantiate them when enumerateObjectInstances runs in your visual's workflow. What this translates to is:

    1. You need a class defining the object properties
      • Property names must exactly match those in capabilities.json
      • Properties must be instantiated with a suitable default value, even if it's null
    2. Instantiating that class as a property of your VisualSettings (and that name must exactly match the object key from capabilities.json)

    So, based on your supplied JSON and assuming you've started from a blank visual, the following code in settings.ts (or wherever you're storing your VisualSettings class) would work under the same assumptions:

    "use strict";

import { dataViewObjectsParser } from "powerbi-visuals-utils-dataviewutils";
import DataViewObjectsParser = dataViewObjectsParser.DataViewObjectsParser;

export class VisualSettings extends DataViewObjectsParser {
  public circle: CircleSettings = new CircleSettings();
}

export class CircleSettings {
  public circleColor: string = 'FF0000';
  public circleThickness: number = 2; 
}

    now, when your visual fires up it will render them in the properties pane, e.g.:

    For further reading, you can refer to the documentation on objects and properties.

    Hopefully this is all you need. Good luck!

    Daniel