How to programmatically set the selection interval in kendo charts for "date" categoryAxis?

3 posts, 1 answers
  1. Luiz
    Luiz avatar
    7 posts
    Member since:
    Sep 2014

    Posted 20 Nov 2014 Link to this post

    Hi, 

    I have two datepickers in my view and an Area Chart with a "date" type category axis with a selection. I want the user to be able to change the selection both directly in the chart and by using the datePickers. When the user changes the date interval in either of the controls, the other control must be updated to reflect the new selection interval.
    I managed to update the datepickers when I change the selection in the chart, but I can't figure out how to update the selection when the user changes the datePickers date.
    I tried the answers in this thread but they just seem to apply to "kendoStockChart" and not to "kendoChart".

    The closest I got to this was with this code:

    var widget = $("#rangeSelectChart").data("kendoChart");
    widget._selections[0].set(new Date("2014/11/05"), new Date("2014/11/15"));

    but it does no changes the actual selection, it creates a NEW selection with the given date interval.

  2. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 24 Nov 2014 Link to this post

    Hi Henrique,

    You can dynamically change the chart selection using the setOptions method. As an example: 
    var widget = $("#chart").data("kendoChart");
    widget.setOptions({categoryAxis: {select: { from: new Date("2014/11/05"), to: new Date("2014/11/15")}}});

    Regards,
    Iliana Nikolova
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Luiz
    Luiz avatar
    7 posts
    Member since:
    Sep 2014

    Posted 26 Nov 2014 in reply to Iliana Nikolova Link to this post

    Thanks! I have tried to set the selection using setOptions but it didn't work. For those stuck with this same problem, you must call the reload method after setting the selection to reflect the changes.

    widget.reload();
Back to Top