Create a histogram Range slider (price , date ..)

Hello everyone,

First of all I want to thank all developers and employees of Syncfusion Compagny for the amazing work they do.

My requirement (question) is this one. I would like to create an Histogram range slider. I know which features that you have developed (Range Slider and Chart (Histogram) i have to use , but i don't know how to combine them to make a binding between the Range slider and the Chart (Histogram). To make it simple and clear, just bellow some images of what i want to do :

rangeslider1.png

rangeslider2.png


As we can see in these images, when i change input box (price) it should binds with the data Histogram and increase the opacity of the bar if there is a match between input value and chart data . Otherwise the bar's opacity (color) is grey . In advance thank you very much for the involevement and help.


Sincerely yours, Dinesh Pesyany






1 Reply

SB Sridevi Bharathi Manohar Syncfusion Team April 15, 2022 12:43 PM UTC

Hi Dinesh,


Greetings from Syncfusion,


We have analysed you query and As of now we unable to combine range slider and chart. So instead of that we have prepared a sample in which RangeSelector and Chart histogram is combined as per your requirement. Please refer to below sample and screenshot.


Screenshot :


Sample : https://stackblitz.com/edit/angular-ghdasu?file=app.component.html


Please let us know if you have any concerns.


Regards,

Sridevi Bharathi.


Loader.
Up arrow icon