Sorry if this is a dumb question, but I have been unable to find an example, or solution anywhere.
I am creating a custom visual where I have svg images floating around on the visual. I need to have each image have its own individual colour (and size – but that will be a question for another time :-)
I want an array of colours that I can iterate through and assign to the “fill=” of the shape. I was hoping something along these lines might work:
I have tried all sorts like this, but cannot get anything to work. What is the best way to approach this?
The host object in the visual constructor exposes an ISandboxExtendedColorPaletteproperty named colorPalette. This extends IColorPalette, which has a method named getColor. You can pass in a value to this to allocate a colour from your theme's palette for the specificed value. IIRC this has up to 240 entries before repeating from the beginning but it can be inspected by doing a console.log on it to confirm the array length.
Quite a few visuals use it already so there are a number of open source examples to refer to. In one of my visuals, I'm assigning to a class property here, and using/assigning it here. It's also in Microsoft's sample bar chart repo if you need a simpler example.