X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=tests%2Fzoom.html;h=121adee35501a68807d48dbf14f837482ee907d8;hb=e1fb3740f1d27bbbb67fbf72e831a3b57bb20d91;hp=608ae6dfd10b8767045a891b39f8a270e556ff31;hpb=437c097971f7b20e593e256385bbc998c781e1d2;p=dygraphs.git diff --git a/tests/zoom.html b/tests/zoom.html index 608ae6d..121adee 100644 --- a/tests/zoom.html +++ b/tests/zoom.html @@ -1,8 +1,8 @@ - noise + zoom @@ -12,9 +12,10 @@

Click the buttons to change the zoom level or just use the normal - click-and drag.

+ click-and drag. While zoom typically works by click-and-drag, the + buttons are useful for testing.

Window coordinates (in dates and values):

-
+

Zoom operations:

@@ -23,7 +24,7 @@       -   +  
    @@ -38,6 +39,7 @@ g = new Dygraph( document.getElementById("div_g"), NoisyData, { + errorBars: true, zoomCallback : function(a,b,c,d) { showDimensions(a,b,c,d); } } ); @@ -53,22 +55,39 @@ showDimensions(minDate, maxDate, minValue, maxValue); function showDimensions(minDate, maxDate, minValue, maxValue) { - var elem = document.getElementById("dimensions"); - elem.innerHTML = - "dateWindow : [" + minDate + " , "+ maxDate + "],
" + - "valueRange : [" + minValue + " , "+ maxValue + "],"; + showXDimensions(minDate, maxDate); + showYDimensions(minValue, maxValue); + } + + function showXDimensions(first, second) { + var elem = document.getElementById("xdimensions"); + elem.innerHTML = "dateWindow : [" + first + ", "+ second + "]"; + } + + function showYDimensions(first, second) { + var elem = document.getElementById("ydimensions"); + elem.innerHTML = "valueRange : [" + first + ", "+ second + "]"; } function zoomGraphX(minDate, maxDate) { - g.doZoomXDates_(minDate, maxDate); + g.updateOptions({ + dateWindow: [minDate, maxDate] + }); + showXDimensions(minDate, maxDate); } function zoomGraphY(minValue, maxValue) { - g.doZoomYValues_(minValue, maxValue); + g.updateOptions({ + valueRange: [minValue, maxValue] + }); + showYDimensions(minValue, maxValue); } function unzoomGraph() { - g.doUnzoom_(); + g.updateOptions({ + dateWindow: null, + valueRange: null + }); }