div.style.color = this.colors[p.name];
div.style.borderColor = this.colors[p.name];
- var self = this;
- Dygraph.addEvent(div, 'click', function(p, self) { return function(e) {
- if (p.annotation.hasOwnProperty('clickHandler')) {
- p.annotation.clickHandler(p.annotation, p, self.dygraph_, e);
- } else if (self.dygraph_.attr_('annotationClickHandler')) {
- self.dygraph_.attr_('annotationClickHandler')(p.annotation, p, self.dygraph_, e);
- } }; }(p, self)
- );
+ Dygraph.addEvent(div, 'click', bindEvt('clickHandler', 'annotationClickHandler', p, this));
+ Dygraph.addEvent(div, 'mouseover', bindEvt('mouseOverHandler', 'annotationMouseOverHandler', p, this));
+ Dygraph.addEvent(div, 'mouseout', bindEvt('mouseOutHandler', 'annotationMouseOutHandler', p, this));
+ Dygraph.addEvent(div, 'dblclick', bindEvt('dblClickHandler', 'annotationDblClickHandler', p, this));
this.container.appendChild(div);
this.annotations.push(div);
</style>
</head>
<body>
+ <input type="button" value="Add Annotation" onclick="add()" />
+ <div id="events"> </div>
<div style="position:absolute; left:100px; top: 200px;" id="g"></div>
<div style="position:absolute; left:600px; top: 200px;" id="list"></div>
g.setAnnotations(annotations);
}
+ var eventDiv = document.getElementById("events");
+ function nameAnnotation(ann) {
+ return "(" + ann.series + ", " + ann.x + ")";
+ }
g.updateOptions( {
annotationClickHandler: function(ann, point, dg, event) {
- document.getElementById("events").innerHTML += "click: (" + ann.series + ", " + ann.x + ")<br/>";
+ eventDiv.innerHTML += "click: " + nameAnnotation(ann) + "<br/>";
+ },
+ annotationDblClickHandler: function(ann, point, dg, event) {
+ eventDiv.innerHTML += "dblclick: " + nameAnnotation(ann) + "<br/>";
+ },
+ annotationMouseOverHandler: function(ann, point, dg, event) {
+ eventDiv.innerHTML += "mouseenter: " + nameAnnotation(ann) + "<br/>";
+ },
+ annotationMouseOutHandler: function(ann, point, dg, event) {
+ eventDiv.innerHTML += "mouseout: " + nameAnnotation(ann) + "<br/>";
}
});
</script>
-
- <input type="button" value="Add Annotation" onclick="add()" />
- <div id="events"> </div>
</body>
</html>