48
Views
4
Comments
Solved
[OutSystems Charts] Pie Chart Colors reset on data refresh
outsystems-charts
Reactive icon
Forge asset by OutSystems
Application Type
Reactive

I am using the current PieChart and setting the color palette during chart initialize event using UpdateChartColorScheme and providing a range of colors. The colors are applied correct when the data set is initially loaded. When the data is refreshed due to a parameter change, the colors revert to the default color scheme. Attempts to call UpdateChartColorScheme during OnAfterFetch event results in an error. 

2022-11-12 11-28-30
Gonçalo Martins
Staff
Solution

Hello @Aaron Blaquiere

This client action could be reviewed for this particular case but the goal is to have it run in the Chart instance creation (that's why we should put it in the Chart initialized event).

For your scenario, you can simply enclose the Chart block inside and if looking at the IsDataFetched attribute (this way the Chart instance is recreated):

For a better UX, you can also set a fixed height for the Chart and set the Chart block OptionalConfigs > DisableLoadingAnimation = True, so the transition can be smoother:

and


Hope it helps!

Cheers,
GM


UserImage.jpg
vikas sharma
Champion

Hi Aaron,

Could you please provide more context on this issue. If you can share some screenshots or better if you can share the oml.

regards

UserImage.jpg
Aaron Blaquiere

I've attached an example. 

The chart loads 10 records from a sample data static entity.

On Chart initialize, I use UpdateChartColorScheme client action to set a blue color palette.

If you refresh the data via refresh button, which refreshes the aggregate, the color palette resets to default. 

ChartExample.oml
2022-11-12 11-28-30
Gonçalo Martins
Staff
Solution

Hello @Aaron Blaquiere

This client action could be reviewed for this particular case but the goal is to have it run in the Chart instance creation (that's why we should put it in the Chart initialized event).

For your scenario, you can simply enclose the Chart block inside and if looking at the IsDataFetched attribute (this way the Chart instance is recreated):

For a better UX, you can also set a fixed height for the Chart and set the Chart block OptionalConfigs > DisableLoadingAnimation = True, so the transition can be smoother:

and


Hope it helps!

Cheers,
GM


UserImage.jpg
Aaron Blaquiere


Thank you. Wrapping component in an If that checks IsDataFetched solved this issue.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.