javascript - zoom a Highcharts chart programatically -
javascript - zoom a Highcharts chart programatically -
in this jsfiddle demo have 2 highcharts line charts. when 1 of charts zoomed, other chart should zoom in on same area. code is
xaxis: { events: { aftersetextremes: function (event) { var index = document.getelementbyid('container2').dataset.highchartschart; var chartpartner = highcharts.charts[index]; chartpartner.xaxis[0].setextremes(event.min, event.max); chartpartner.showresetzoom(); } }, },
wherein container2
id of dom element other chart rendered to. behaviour working, there couple of little problems:
chartpartner.showresetzoom();
your problem called setextremes in infinite loop, because told "aftersetextremes" event trigger "aftersetextremes" event. can prevent having state-variable.
that's why introduced this:
var updating = false;
and changed lastly part of events that:
if (!updating) { updating = true; chartpartner.xaxis[0].setextremes(event.min, event.max); chartpartner.showresetzoom(); } else { updating = false; }
jsfiddle: http://jsfiddle.net/qq4wnyqo/1/
edit: original jsfiddle produced console error 'maximum phone call stack size exceeded'. next time want stuff that.
edit: still need find solution hiding 'reset zoom' buttons after they're used.
javascript highcharts
Comments
Post a Comment