I am currently working on a Dashboard application, using many different charts to display data.
I tried using a donut chart but apparently there were too many different data types to the default color theme, so there were a lot of different data displayed with the same color.
Did anybody ever encounter this problem? How should I solve this?
I've attached a screenshot of the current chart to better explain the problem.
Hi @Thiago Ribeiro Freitas,
Refer this solution : https://www.outsystems.com/forums/discussion/70202/how-to-specify-3-colors-for-all-donut-pie-charts-and-graphs-on-a-page/
Additionally, you can check below
https://stackoverflow.com/questions/28828915/how-set-color-family-to-pie-chart-in-chart-js
https://www.anychart.com/blog/2021/07/06/donut-charts-javascript/
https://js.devexpress.com/Documentation/ApiReference/UI_Components/dxPieChart/Series_Types/DoughnutSeries/
Thanks, Aadhavan S
Thank you @Aadhavan Shanmugam !
The solutions you gave me were great for entities with lesser records, and I used it in other cases.
Is there a way you can show me how to solve this via javascript in OutSystems? I am very unexperienced with JS inside OutSystems!
Grateful for your time!
We can use javascript for it, or you can refer website where you can get javascript code, implement it in outsystems, and do customization
Hello Thiago
With a large number of list if you will follow any color family it might show the same colors.
You can approach different colors with saving the Hex Code of color you want in the Entity and pass the values in color. So, with the statics the colors will also be fetched.
Or Simply you can create set of colors that will repeat alternatively to display the difference like -
Please feel free to ask in case you need further assistance with any of these approaches
@Manish Gupta Is there a way to set an array of colors?
The entity I am trying to display is composed by more than 30 records, so manually setting the colors would be a little unpratical
Thank you for your support!
If you are trying to show a few colors in Alternative way then we can create actions to pass the colors.
In case, you are talking to save the different colors then we can save it with a loop in the entity.
Let me know what are you trying first?
I am not specifically trying to save colors, I just want to set a different color for each element in the entity. The problem is that this entity is 33 records long, so its unpractical to set manually each color
Please find the attached OML, I hope it will solve the problem. We don't have to run manually to save the color. We Just need to have a List of 30 colors we have to apply. I have created this sample for 8 Entries. You can check and try in your app.
Check ApplyFavouriteChartColorsServer Server Action using in Fetch.
Let me know in case you are facing any issues. Alternatively to pass the color you can use the Forge component suggested by Eduardo to get random color and pass to the list.
Thanks
I had the same issue as you're having and I've used this color randomizer component ;)https://www.outsystems.com/forge/component-overview/136/random-hexadecimal-colour