Need to highlight a selected label column chart when clicked in column chart
Application Type
Reactive
Service Studio Version
11.11.7 (Build 45559)

HI All,

I have a scenario where i have graph which is calculated on Quarter on Quarter basis as can be seen in left in attached snapshot.

on clicking of it (any of three columns for a quarter) in left Quarter chart, second charts for months gets populated. Now the requirement is we want on Quarter UI chart , selected quarter should get highlighted something like as seen in snap, so that user get to know that Q2 /Q3 is selected.

Any pointer or help is appreciated

Chart.jpg

Hi Swapnil,

I have a workaround. you can add style using jquery/javascirpt to that when selecting that column

like below

style="stroke:rgb(0, 255, 0);stroke-width: 5px;"

reference - https://www.w3schools.com/graphics/svg_rect.asp


Did you get a chance to check it with your Chart code?

Hi Swapnil,

the highcharts library allows for different styling of a selected item on a chart.  You can explore this in the highcharts api documentation.

You can make use of a combination of plotOptions.column.allowPointSelect and plotOptions.column.states.select.

Dorine

Hi Swapnil, 

You can change the color of the selected bar. I am attaching the .oml file for your reference.


Regards

Poonam



GraphOnClick.oml

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