]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Line Chart label hoverMode & tooltips
authorTanner Linsley <tannerlinsley@gmail.com>
Fri, 15 May 2015 23:03:51 +0000 (17:03 -0600)
committerTanner Linsley <tannerlinsley@gmail.com>
Fri, 15 May 2015 23:03:51 +0000 (17:03 -0600)
samples/line.html
src/Chart.Core.js
src/Chart.Line.js

index 8e5968c48738586fbd513e7649d917ae4b78752e..b3d6c85343f070d1519e30680b13978a7d87ee36 100644 (file)
@@ -47,7 +47,8 @@
        window.onload = function(){
                var ctx = document.getElementById("canvas").getContext("2d");
                window.myLine = new Chart(ctx).Line(lineChartData, {
-                       responsive: true
+                       responsive: true,
+                       hoverMode: 'label'
                });
        };
 
index f0d8e2d1f6c2d5267b00ae9e7e3acdfca9bff51d..93b7deb5e544485a8f2ceb9f46304950e77309ce 100755 (executable)
 
                        for (var datasetIndex = 0; datasetIndex < this.data.datasets.length; datasetIndex++) {
                                for (elementIndex = 0; elementIndex < this.data.datasets[datasetIndex].metaData.length; elementIndex++) {
-                                       if (this.data.datasets[datasetIndex].metaData[elementIndex].inRange(eventPosition.x,eventPosition.y)){
+                                       if (this.data.datasets[datasetIndex].metaData[elementIndex].inGroupRange(eventPosition.x,eventPosition.y)){
                                                helpers.each(this.data.datasets, datasetIterator);
                                        }
                                }
 
 
        Chart.Point = Chart.Element.extend({
-               inRange: function(chartX,chartY){
+               inRange: function(mouseX,mouseY){
                        var vm = this._vm;
                        var hoverRange = vm.hoverRadius + vm.radius;
-                       return ((Math.pow(chartX - vm.x, 2)+Math.pow(chartY - vm.y, 2)) < Math.pow(hoverRange,2));
+                       return ((Math.pow(mouseX - vm.x, 2)+Math.pow(mouseY - vm.y, 2)) < Math.pow(hoverRange,2));
+               },
+               inGroupRange: function(mouseX){
+                       var vm = this._vm;
+                       return (Math.pow(mouseX-vm.x, 2) < Math.pow(vm.radius + this.hoverRadius,2));
                },
                tooltipPosition : function(){
                        var vm = this._vm;
index 9c118a56cdcb659969d4014bf93c4298d9f01f55..568f1097def264bccc13ea57ff0a329e934f67ab 100644 (file)
 
 
                        // Hover animations
+                       this.tooltip.pivot();
+                       
                        if(!this.animating){
                                var changed;
                                
                                        (this.lastActive.length && !this.active.length)||
                                        (this.lastActive.length && this.active.length && changed)){
 
-                                       this.tooltip.pivot();
                                        this.stop();
                                        this.render(this.options.hoverAnimationDuration);
                                }