53
Views
4
Comments
Fixed graph colors not working when there is only one data series present
Question

Hi,

I have a statistics page where I display a lot of graphs. In these graphs, I use the same data series, and to make it more organized, I want to use the same colors for the same data series in the different graphs. I have managed to get this working, but only when there are more than one data series present.

To make it more understandable, I created a hypothetical case where I want to display various graphs regarding the performance of salespeople. In every graph, I want to use the same color for the same salesperson. For example, if the data series name is "Henk," the color of this data point must be red in every graph.

I have managed to do this by first fetching all the different salespeople and assigning each one a specific color. As long as there is more than one data series present, meaning more than one salesperson, this works. However, if there is only one data series present (one salesperson), then this doesn't work.

You can see how in the first two graphs, the colors of the data series names are the same, despite the order being different. In the last graph, you can see that the color of the data series is different from the first two.

How I assign a color to every data series:

In the attached OML you will find a working example.


Does someone know how I can fix my problem?

Thanks in advance.


Chris

GraphTester.oml
2022-09-12 05-19-11
Apoorv Choubey

Hi @Chris van den Heuvel check attached screenshot, oml and url as well if it's help to resolve your issue please let me know or otherwise i will resolve with another way.

Live Sample URL

Data point color change for single series in the third column chart.

Here is script which i used to manipulate data point colors.

"{series: [{data: [{color: 'red'}, {color: 'blue'}, {color: 'green'}]}]}"   

 

Use below property into AdvancedFormat -> HigchartsJSON 

(1) If you want to customize the colors, you can also provide your own array of colors using the colors property in the chart options.

" { colors: ['red', 'blue', 'green', 'orange'],

     series: [{

                   colorByPoint: true,

                   data: [5, 10, 15, 20]

                  }] 

}"


(2) Highcharts will automatically assign different colors to each column based on its default color palette. 

"{

series: [{        

   colorByPoint: true,        

  data: [5, 10, 15, 20]    }]

}"

GraphTesterUpdated.oml
2023-02-03 09-48-00
Chris van den Heuvel

Hi @Apoorv Choubey and thank you for your reply.

Unfortunately this is not entirely what I am looking for.

I'm not looking to set a fixed set of colors regardless of the data series names, but to assign a color to a certain data series name. Keep in mind that I cannot hard code the names of the data series as that would make the graphs less dynamic.

As shown in the example above, I fetch a set of colors and assign them to the different data series names. In the example I shared this works, as long as there are multiple data series names present. In the image below you can see that the color for the data series name 'Anna' stays the assigned jade/green color but changes to yellow when there are no other data series names in the same graph. This change to yellow should not have happened, as the assigned color is still jade/green.

This image relates to the images above where I set the colors.


Kind regards,

Chris

2023-09-06 07-26-35
Sudip Pal

Hey Chris,

Use the below code for the assignment of DataSeriesJSON

Replace("color: {COLOUR}", 

   "{COLOUR}", 

   If(GetSalesPersons.List.CurrentRowNumber < GetGraphColors.List.Length,        GetGraphColors.List[GetSalesPersons.List.CurrentRowNumber].GraphColor.Label, 

       "#000" 

     )

)


Thanks & Regards,

Sudip Pal



2023-02-03 09-48-00
Chris van den Heuvel

Hi @Sudip Pal and thank you for the response.

The change to the code you suggested is the removal of the quotation marks around the word to be replaced. This makes it so that the graph is unable to render:


Kind regards,

Chris

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