3 <meta http-equiv=
"X-UA-Compatible" content=
"IE=EmulateIE7; IE=EmulateIE9">
4 <title>isZoomedIgnoreProgrammaticZoom Flag
</title>
6 <script type=
"text/javascript" src=
"../excanvas.js"></script>
8 <script type=
"text/javascript" src=
"../strftime/strftime-min.js"></script>
9 <script type=
"text/javascript" src=
"../rgbcolor/rgbcolor.js"></script>
10 <script type=
"text/javascript" src=
"../dygraph-canvas.js"></script>
11 <script type=
"text/javascript" src=
"../dygraph.js"></script>
12 <script type=
"text/javascript" src=
"data.js"></script>
15 <!-- Ensure that the documentation generator picks us up: {isZoomedIgnoreProgrammaticZoom:} --
>
16 <h1>isZoomedIgnoreProgrammaticZoom Option
</h1>
18 By default, when the
<code>dateWindow
</code> or
<code>updateOptions
</code>
19 of a chart is changed programmatically by a call to
<code>updateOptions
</code>
20 the zoomed flags (
<code>isZoomed
</code>) are changed. This is the same
21 as manually zooming in using the mouse.
24 Sometimes it may be desirable to change the display of the chart by
25 manipulating the
<code>dateWindow
</code> and
<code>valueRange
</code>
26 options but without changing the zoomed flags, for example where manual
27 zooming is still required but where it is also desired that the zoomed
28 flags drive display elements, but only for manual zooming.
31 In this case
<code>isZoomedIgnoreProgrammaticZoom
</code> may be specified along with
32 either the
<code>dateWindow
</code> or
<code>valueRange
</code> values to
33 <code>updateOptions
</code> and the zoomed flags will remain unaffected.
36 The chart below may be manipulated to change the
<code>updateOptions
</code>
37 using the Max and Min Y axis buttons and the
<code>dateWindow
</code>
38 by using the Max and Min X axis buttons.
41 Toggle the check box below to determine the difference in operation of the zoom flags
42 when the date and value windows of the chart are changed using the arrows underneath.
44 <p><input id=
"isZoomedIgnoreProgrammaticZoom" type=
"checkbox" checked=true
/>Do not change zoom flags (
<code>isZoomedIgnoreProgrammaticZoom
</code>)
</p>
47 <div style=
"float: left">
50 <input type=
"button" value=
"↑" onclick=
"adjustTop(+1)" />
51 <input type=
"button" value=
"↓" onclick=
"adjustTop(-1)" />
55 <input type=
"button" value=
"↑" onclick=
"adjustBottom(+1)" />
56 <input type=
"button" value=
"↓" onclick=
"adjustBottom(-1)" />
60 <input type=
"button" value=
"←" onclick=
"adjustFirst(-100000000)" />
61 <input type=
"button" value=
"→" onclick=
"adjustFirst(+100000000)" />
65 <input type=
"button" value=
"←" onclick=
"adjustLast(-100000000)" />
66 <input type=
"button" value=
"→" onclick=
"adjustLast(+100000000)" />
69 <div id=
"div_g" style=
"width: 600px; height: 300px; float: left"></div>
70 <div style=
"float: left">
74 <div style=
"display: inline-block">
75 <h4> Zoomed Flags
</h4>
76 <p>Zoomed:
<span id=
"zoomed">False
</span></p>
77 <p>Zoomed X:
<span id=
"zoomedX">False
</span></p>
78 <p>Zoomed Y:
<span id=
"zoomedY">False
</span></p>
79 <h4>Window coordinates (in dates and values):
</h4>
80 <div id=
"xdimensions"></div>
81 <div id=
"ydimensions"></div>
84 <script type=
"text/javascript">
86 document.getElementById(
"div_g"),
90 zoomCallback : function(minDate, maxDate, yRange) {
91 showDimensions(minDate, maxDate, yRange);
93 drawCallback: function(me, initial) {
94 document.getElementById(
"zoomed").innerHTML =
"" + me.isZoomed();
95 document.getElementById(
"zoomedX").innerHTML =
"" + me.isZoomed(
"x");
96 document.getElementById(
"zoomedY").innerHTML =
"" + me.isZoomed(
"y");
97 var x_range = me.xAxisRange()
98 var elem = document.getElementById(
"xdimensions")
99 elem.innerHTML =
"dateWindow : [" + x_range[
0] +
", "+ x_range[
1] +
"]"
104 // Pull an initial value for logging.
105 var minDate = g.xAxisRange()[
0];
106 var maxDate = g.xAxisRange()[
1];
107 var minValue = g.yAxisRange()[
0];
108 var maxValue = g.yAxisRange()[
1];
109 showDimensions(minDate, maxDate, [minValue, maxValue]);
111 function showDimensions(minDate, maxDate, yRanges) {
112 showXDimensions(minDate, maxDate);
113 showYDimensions(yRanges);
116 function getNoChange() {
118 var elem = document.getElementById(
"isZoomedIgnoreProgrammaticZoom")
120 options.isZoomedIgnoreProgrammaticZoom = true
125 function adjustTop(value) {
126 options = getNoChange()
128 options.valueRange = [minValue, maxValue]
130 g.updateOptions(options)
133 function adjustBottom(value) {
134 options = getNoChange()
136 options.valueRange = [minValue, maxValue]
138 g.updateOptions(options)
141 function adjustFirst(value) {
142 options = getNoChange()
144 options.dateWindow = [minDate, maxDate]
146 g.updateOptions(options)
149 function adjustLast(value) {
150 options = getNoChange()
152 options.dateWindow = [minDate, maxDate]
153 g.updateOptions(options)
156 function showXDimensions(first, second) {
157 var elem = document.getElementById(
"xdimensions");
158 elem.innerHTML =
"dateWindow: [" + first +
", "+ second +
"]";
161 function showYDimensions(ranges) {
162 var elem = document.getElementById(
"ydimensions");
163 elem.innerHTML =
"valueRange: [" + ranges +
"]";