Hello,
Is it possible to change the font color of a dash plotly figure by using css?
I have a plotly figure in my dashboard that I need to change its font color based on dark/light modes.
I know how to do it using a callback. the problem however is that I would have to load the figure data and layout each time the callback is triggered which is not efficient.
I tried to change the css style of the class .svg-containerthat contains the plotly figure, but it didn’t help.
any ideas?
Hi,
I don’t think it is possible to do it with css. On the other hand, when you say that it is not efficient to do it via a callback, are you recreating the figure with go.Figure each time it is triggered or manipulating the figure dictionary instead (passing it as a State)? The latter method can speed things up considerably…
Another alternative (that should be even faster) is to use a clientside callback to change the properties that you want. If you are using plotly templates, then you might want to store them in a dcc.Store component to be able to use these objects client-side.
Lastly, dash-extensions now supports partial updates of props, which can be very useful when manipulating large objects in props like dcc.Chart.figure. I haven’t tested it yet, but it sounds extremely useful!
You can find the announcement thread here: OperatorTransform - List and dict operations, and partial component property updates
Hope this helps! 