Range Picker Custom

[boraerel]

Hi,
Is there anyway to change RangePicker Custom Component "http://keith-wood.name/datepick.html#range" range picker. I want to use this component when i press the "Choose Date" a href.
Could you please help me.
Thanks.

[jedrzej.r]

Hi!

Thanks for contacting us with your question!

Of course, it is possible to incorporate custom date or date range pickers into Highcharts! After enabling your custom date picker, you'd have to take these values and use setExtremes method to change visible range of the chart. Take a look at below example to see it in action. If you'd also like to disable the built-in date picker, you could disable rangeSelector.inputEnabled property.

Demo: https://jsfiddle.net/BlackLabel/wmngshvd/

API:
https://api.highcharts.com/class-refere ... etExtremes
https://api.highcharts.com/highstock/ra ... putEnabled

Let me know if that was what you were looking for.
Best regards!

[boraerel]

Thanks for your reply. Is there any way to put these component in to the rangepicker place of right top to chart?

[jedrzej.r]

Of course! You can wrap these elements (Highcharts container and date picker) in another div, and then play around with the position of the input. For example, you could add position: absolute CSS property to the picker and place it in the top right corner of the Highcharts container.

Demo: https://jsfiddle.net/BlackLabel/u1k06vor/

In case you happen to have any more questions, feel free to ask anytime.
Best regards!