Hello there everyone.
I am trying to change the background of a PowerChart component depending if the session theme is "light" or "black". The idea is that when the theme is light the color would be #C0C0C0 and #555555 otherwise. I tried to do a Change Script using session.props.theme on the color property inside the "plot" option of the chart, but that didn't seem to work.
Is there any way to do that?
The background color is set by plots.0.color, etc.
Unfortunately the Perspective chart components are all third-party (mostly AM Charts) and don't know about the Perspective themes so we can't use theme variables such as --neutral-20, etc. My workaround has been to create a session custom variables for any colors I want and then create an expression binding on those. For example,
if(left({this.props.theme}, 4) = 'dark',
'#333333',
'#dddddd'
)
Then bind plots.0.color to that session prop.
As you can see, the only restriction is that all my dark themes have to start with 'dark'. If you want to get fancy, create a colorConfig object in the session variables and create objects within that such as an array of colors for the pens. Here's a sample.
Okay I'll try it, thanks a lot!
I was also thinking, could it be possible to set the plot background transparent so the color would match the container background color?
Yes. Set the alpha (opacity) value of the color to minimum. e.g.,
#ff0000 // red
#ff0000ff // red opaque
#ff000000 // red transparent
Just add 00 to whatever color you've got and the background will be transparent.
That seemed to work! Thanks a lot