This is a migrated thread and some comments may be shown as answers.

Stock chart - change categoryaxis labels while using navigator

2 Answers 119 Views
Charts
This is a migrated thread and some comments may be shown as answers.
Kevin
Top achievements
Rank 1
Kevin asked on 17 Jun 2014, 04:31 AM
Hi,

How can I change the labels on category axis while moving stock chart navigator without refresh/redrawing the chart please?

When the user narrows the date range selection to 1 day, I want to display the times on category axis, else display days.

I'm not able to achieve this without refreshing the chart. Refreshing the chart is a performance barrier. 

function onSelectEnd(e) {
               var categoryAxis = this.options.categoryAxis[0];
               categoryAxis.labels.step = 4;
               categoryAxis.majorGridLines.step = 2;
               categoryAxis.minorGridLines.step = 2;
               categoryAxis.majorTicks.step = 2;

              //make this effective on chart right away

}
 If I don't refresh the chart, above the changes to categoryaxis are not getting applied right away, rather are getting applied when I use the navigator next time.

Please help. Thanks!

2 Answers, 1 is accepted

Sort by
0
T. Tsonev
Telerik team
answered on 18 Jun 2014, 03:56 PM
Hi,

You can limit the refresh to the upper pane by naming it and using the redraw(paneName) overload:
      panes: [{
        name: "default"
      }],
      selectEnd: function(e) {
        var categoryAxis = this.options.categoryAxis[0];
        ...

        this.redraw("default");
      }


-- Live demo --

I hope this helps.

Regards,
T. Tsonev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Kevin
Top achievements
Rank 1
answered on 18 Jun 2014, 10:38 PM
Thank you!

I was also able to archive this without calling .redraw(). The code is a bit ugly though.

Code looks like this:

function onSelectEnd(e) {
     if (flgSelectEnd == 0)   //to avoid calling this function from refreshchart - _selectEnd()
                  refreshChart();
}
function refreshChart()
{
   //do chart label changes
   flgSelectEnd = 1;
   $("#linechart").getKendoStockChart()._navigator._selectEnd();
   flgSelectEnd = 0;
}


Tags
Charts
Asked by
Kevin
Top achievements
Rank 1
Answers by
T. Tsonev
Telerik team
Kevin
Top achievements
Rank 1
Share this question
or