show dynamic data or more data of highcharts in sidebar

Hi all,

I'm working on a reactive web app. I have multiple charts (column and donut - created using Highcharts). I'm trying to add a sidebar that shows more details (maybe a table) on click of any chart (there might be a show more button below every chart). 

Is it possible to do so ? If yes, can anyone help? I've installed Reactive Sidebar with Overlay from forge but don't know how to go from here or maybe use the default sidebar that comes built in with outsystems. 

if you need a visual on how or what I want to show, here's an example : https://jsfiddle.net/BlackLabel/8s9mucwk/
There is a hamburger menu on top right of chart. On click of it a table appears on the bottom of the chart. I'm trying to show the same but in a sidebar. And this would be dynamic as there are 8 charts and on click of any chart I need to show their respective data.

Hey Aman,

You'll probably need to use blocks on your side bar, so you can show the data that you want more easily. You can add an input to your buttons (like and integer or something that can identify your charts), and then, on your side bar, have logic (If) to decide which block of data to show.

Hope this helps!

Hey @Laura Fidalgo ,

Thanks for the help.

Is it possible to change the data inside block (like a table) based on the button values (like you said - integer or something to identify the charts) ? I'm sorry, but I do not know how to do this, just a heads-up would help me a lot.

Regards,

Aman

Any time Aman!

Of course, you can have 1 block of each chart, and the If widget to check the condition of your input and see which block to show, or you can have 1 block with multiple tables, and check which one to use.

The input is important, so you know which button you've clicked and which block/data to show. And use the nested If widgets to show your data.

Cheers

Hi Laura,

Thanks for your suggestion. I can show respective tables by using if condition. But I have two questions if you can suggest anything for them, that would be great. 

1. I used button below every chart - so that they have some kind of value and I can pick them up on click to show data on sidebar. Where can I pass value for every button so that I read them? Also how can I read a value assigned to a button, if any ?

2. I can see only true or false part in If. is there anything I'm missing as I cannot use only if or multiple if-elses


Hey Aman,

Happy to provide you with a solution :)

You'll need to have an action on your button's onclick, and have it as an input of the action

Hi @Aman Devrath 

Can you share the oml or a screenshot in detail on what you are trying to achieve?


Thanks

Shubham

Hi @Shubham Tiwari ,

Actually I dont have anything to show. But consider somewhat like below (refer image as well). 

I have 8 charts on one screen, populated by using highcharts. lets say I have a "More" button below every chart. on click of more button, a sidebar opens up like in the image and it shows a table of that particular chart.  For eg:  if I click "More" button on first chart (named as backlog in the image), it should show a table related to that chart, if I click "More" button on 4th chart( named as backlog ageing by status), it should show a table of data of that chart.

I'm not sure how to do this as I can't figure out any way. 

Hey Aman,

You'll probably need to use blocks on your side bar, so you can show the data that you want more easily. You can add an input to your buttons (like and integer or something that can identify your charts), and then, on your side bar, have logic (If) to decide which block of data to show.

Hope this helps!

Hey @Laura Fidalgo ,

Thanks for the help.

Is it possible to change the data inside block (like a table) based on the button values (like you said - integer or something to identify the charts) ? I'm sorry, but I do not know how to do this, just a heads-up would help me a lot.

Regards,

Aman

Any time Aman!

Of course, you can have 1 block of each chart, and the If widget to check the condition of your input and see which block to show, or you can have 1 block with multiple tables, and check which one to use.

The input is important, so you know which button you've clicked and which block/data to show. And use the nested If widgets to show your data.

Cheers

Hi Laura,

Thanks for your suggestion. I can show respective tables by using if condition. But I have two questions if you can suggest anything for them, that would be great. 

1. I used button below every chart - so that they have some kind of value and I can pick them up on click to show data on sidebar. Where can I pass value for every button so that I read them? Also how can I read a value assigned to a button, if any ?

2. I can see only true or false part in If. is there anything I'm missing as I cannot use only if or multiple if-elses


Hey Aman,

Happy to provide you with a solution :)

You'll need to have an action on your button's onclick, and have it as an input of the action

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