5 <script type=
"text/javascript" src=
"excanvas.js"></script>
7 <script type=
"text/javascript" src=
"../strftime/strftime-min.js"></script>
8 <script type=
"text/javascript" src=
"../rgbcolor/rgbcolor.js"></script>
9 <script type=
"text/javascript" src=
"../dygraph-canvas.js"></script>
10 <script type=
"text/javascript" src=
"../dygraph.js"></script>
11 <style type=
"text/css">
13 background-color: #dddddd
18 <input type=
"button" value=
"Add Annotation" onclick=
"add()" />
19 <div id=
"events"> </div>
20 <div style=
"position:absolute; left:100px; top: 200px;" id=
"g"></div>
21 <div style=
"position:absolute; left:600px; top: 200px;" id=
"list"></div>
23 <script type=
"text/javascript">
25 document.getElementById(
"g"),
27 var zp = function(x) { if (x <
10) return
"0"+x; else return x; };
28 var r =
"date,parabola,line,another line,sine wave\n";
29 for (var i=
1; i<=
31; i++) {
30 r +=
"200610" + zp(i);
31 r +=
"," +
10*(i*(
31-i));
33 r +=
"," +
10*(
250 -
8*i);
34 r +=
"," +
10*(
125 +
125 * Math.sin(
0.3*i));
44 drawCallback: function(g) {
45 var ann = g.annotations();
47 for (var i =
0; i < ann.length; i++) {
48 html +=
"(" + ann[i].series +
", " + ann[i].x +
"): " + ann[i].shortText +
" -> " + ann[i].text +
"<br/>";
50 document.getElementById(
"list").innerHTML = html;
57 for (var x =
10; x <
15; x +=
2) {
62 text: 'Stock Market Crash ' + x
67 series: 'another line',
69 icon: 'http://www.planscalendar.com/icons/dollar_sign_32x32.gif',
72 cssClass: 'annotation',
73 clickHandler: function() {
74 document.getElementById(
"events").innerHTML +=
"special handler<br/>";
77 g.setAnnotations(annotations);
81 var annnotations = g.annotations();
90 g.setAnnotations(annotations);
93 var eventDiv = document.getElementById(
"events");
94 function nameAnnotation(ann) {
95 return
"(" + ann.series +
", " + ann.x +
")";
98 annotationClickHandler: function(ann, point, dg, event) {
99 eventDiv.innerHTML +=
"click: " + nameAnnotation(ann) +
"<br/>";
101 annotationDblClickHandler: function(ann, point, dg, event) {
102 eventDiv.innerHTML +=
"dblclick: " + nameAnnotation(ann) +
"<br/>";
104 annotationMouseOverHandler: function(ann, point, dg, event) {
105 eventDiv.innerHTML +=
"mouseenter: " + nameAnnotation(ann) +
"<br/>";
107 annotationMouseOutHandler: function(ann, point, dg, event) {
108 eventDiv.innerHTML +=
"mouseout: " + nameAnnotation(ann) +
"<br/>";