4 <link rel=
"stylesheet" href=
"../dist/dygraph.css">
5 <title>Multiple y-axes with valueRange
</title>
6 <script type=
"text/javascript" src=
"../dist/dygraph.js"></script>
10 <h2>Multiple y-axes with valueRange
</h2>
11 <p>The same data with both different valueRanges. Two-axis old y[
40,
70] valueRange:
</p>
12 <div id=
"demodiv" style=
"width: 640; height: 350; border: 1px solid black"></div>
13 <p>Two-axis new valueRange y[
40,
80] set:
</p>
14 <div id=
"demodiv_one" style=
"width: 640; height: 350; border: 1px solid black"></div>
15 <p>Two-axis new valueRange y[
40,
80]
& y2[
1e6,
1.2e6] set:
</p>
16 <div id=
"demodiv_two" style=
"width: 640; height: 350; border: 1px solid black"></div>
17 <script type=
"text/javascript">
19 for (var i =
1; i <=
100; i++) {
21 if (d
> 31) { m =
"02"; d -=
31; }
22 if (m ==
"02" && d
> 28) { m =
"03"; d -=
28; }
23 if (m ==
"03" && d
> 31) { m =
"04"; d -=
31; }
24 if (d <
10) d =
"0" + d;
25 // two series, one with range
1-
100, one with range
1-
2M
26 data.push([new Date(
"2010/" + m +
"/" + d),
29 1e6 * (
1 + i * (
100 - i) / (
50 *
50)),
30 1e6 * (
2 - i * (
100 - i) / (
50 *
50))]);
34 document.getElementById(
"demodiv"),
37 labels: [ 'Date', 'Y1', 'Y2', 'Y3', 'Y4' ],
45 // set axis-related properties here
49 ylabel: 'Primary y-axis',
50 y2label: 'Secondary y-axis'
55 document.getElementById(
"demodiv_one"),
58 labels: [ 'Date', 'Y1', 'Y2', 'Y3', 'Y4' ],
68 // set axis-related properties here
72 ylabel: 'Primary y-axis',
73 y2label: 'Secondary y-axis',
83 document.getElementById(
"demodiv_two"),
86 labels: [ 'Date', 'Y1', 'Y2', 'Y3', 'Y4' ],
97 // set axis-related properties here
98 valueRange: [
1e6,
1.2e6],
102 ylabel: 'Primary y-axis',
103 y2label: 'Secondary y-axis'