better tooltip

src/stw-padmws-graph.js

@@ -137,6 +137,12 @@ var Graph = (function () {
                                 self.chart.update();
                             }
                         },
+                        hover: {
+                            intersect: false
+                        },
+                        tooltips: {
+                            intersect: false
+                        },
                         maintainAspectRatio: false,
                         scales: {
                             xAxes: [{
@@ -183,6 +189,21 @@ var Graph = (function () {
                         data: []
                     };
                 }
+                // var parentEventHandler = Chart.Controller.prototype.eventHandler;
+                // Chart.Controller.prototype.eventHandler = function() {
+                //     var ret = parentEventHandler.apply(this, arguments);
+                //     this.clear();
+                //     this.draw();
+                //     var yScale = this.scales['y-axis-0'];
+                //     console.log(arguments[0].x);
+                //         // Draw the vertical line here
+                //     this.chart.ctx.beginPath();
+                //     this.chart.ctx.moveTo(arguments[0].x, yScale.getPixelForValue(yScale.max));
+                //     this.chart.ctx.strokeStyle = "#ff0000";
+                //     this.chart.ctx.lineTo(arguments[0].x, yScale.getPixelForValue(yScale.min));
+                //     this.chart.ctx.stroke();
+                //     return ret;
+                // };
                 reqwest({
                     url: self.url + "/graph/" + self.id,
                     method: 'get',

src/stw-padmws-graph.ts

@@ -156,6 +156,12 @@ class Graph {
                                 self.chart.update();
                             }
                         },
+                        hover: {
+                            intersect : false
+                        },
+                        tooltips: {
+                            intersect : false
+                        },
                         maintainAspectRatio: false,
                         scales: {
                             xAxes: [{
@@ -204,6 +210,26 @@ class Graph {
                     }
                 }
 
+
+                // var parentEventHandler = Chart.Controller.prototype.eventHandler;
+                // Chart.Controller.prototype.eventHandler = function() {
+                //     var ret = parentEventHandler.apply(this, arguments);
+                    
+                //     this.clear();
+                //     this.draw();
+                    
+                //     var yScale = this.scales['y-axis-0'];
+                //     console.log(arguments[0].x);
+                //         // Draw the vertical line here
+                //     this.chart.ctx.beginPath();
+                //     this.chart.ctx.moveTo(arguments[0].x, yScale.getPixelForValue(yScale.max));
+                //     this.chart.ctx.strokeStyle = "#ff0000";
+                //     this.chart.ctx.lineTo(arguments[0].x, yScale.getPixelForValue(yScale.min));
+                //     this.chart.ctx.stroke();
+
+                //     return ret;
+                // };
+
                 reqwest({
                     url: self.url+"/graph/" + self.id,
                     method: 'get',