The ultimate Microsoft Fabric, Power BI, Azure AI & SQL learning event! Join us in Las Vegas from March 26-28, 2024. Use code MSCUST for a $100 discount. Register Now
Hi all,
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?
Thanks in advance
Solved! Go to Solution.
Hi all,
Got this to work…
Added this array to the class Visual:
Pushed colours: ””, to the properties of the svg in the HTMLElement
And in my drawSVG method:
Now I need to find a better way of getting a list of colours into the array.
Thanks for looking.
Hi all,
Got this to work…
Added this array to the class Visual:
Pushed colours: ””, to the properties of the svg in the HTMLElement
And in my drawSVG method:
Now I need to find a better way of getting a list of colours into the array.
Thanks for looking.
Hi @Anonymous
The host object in the visual constructor exposes an ISandboxExtendedColorPalette property 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.
Alternatively, you can take a look at powerbi-visuals-utils-colorutils but the overhead is slightly higher than grabbing it stright from the constructor.
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.
Hopefully this helps you out!
Good luck,
Daniel
Proud to be a Super User!
My course: Introduction to Developing Power BI Visuals
On how to ask a technical question, if you really want an answer (courtesy of SQLBI)
Thanks for the info Daniel. Will be looking into that this afternoon.
Thanks
Mason
User | Count |
---|---|
17 | |
2 | |
2 | |
2 | |
1 |
User | Count |
---|---|
20 | |
10 | |
5 | |
4 | |
3 |