Merge pull request #1427 from plotly/gl2d-hover-curve-number

Show correct curve number in gl2d hover data

Author: etpinard

src/plots/gl2d/scene2d.js

@@ -51,7 +51,6 @@ function Scene2D(options, fullLayout) {
 
     // trace set
     this.traces = {};
-    this._inputs = {};
 
     // create axes spikes
     this.spikes = createSpikes(this.glplot);
@@ -362,7 +361,6 @@ proto.destroy = function() {
     this.container.removeChild(this.mouseContainer);
 
     this.fullData = null;
-    this._inputs = null;
     this.glplot = null;
     this.stopped = true;
 };
@@ -487,7 +485,6 @@ proto.updateTraces = function(fullData, calcData) {
     // update / create trace objects
     for(i = 0; i < fullData.length; i++) {
         fullTrace = fullData[i];
-        this._inputs[fullTrace.uid] = i;
         var calcTrace = calcData[i],
             traceObj = this.traces[fullTrace.uid];
 
@@ -500,16 +497,22 @@ proto.updateTraces = function(fullData, calcData) {
 };
 
 proto.emitPointAction = function(nextSelection, eventType) {
+    var uid = nextSelection.trace.uid;
+    var trace;
 
-    var curveIndex = this._inputs[nextSelection.trace.uid];
+    for(var i = 0; i < this.fullData.length; i++) {
+        if(this.fullData[i].uid === uid) {
+            trace = this.fullData[i];
+        }
+    }
 
     this.graphDiv.emit(eventType, {
         points: [{
             x: nextSelection.traceCoord[0],
             y: nextSelection.traceCoord[1],
-            curveNumber: curveIndex,
+            curveNumber: trace.index,
             pointNumber: nextSelection.pointIndex,
-            data: this.fullData[curveIndex]._input,
+            data: trace._input,
             fullData: this.fullData,
             xaxis: this.xaxis,
             yaxis: this.yaxis

test/jasmine/karma.conf.js

@@ -35,6 +35,14 @@ function func(config) {
     //     See CONTRIBUTING.md for additional notes on reporting.
     func.defaultConfig.logLevel = config.LOG_INFO;
 
+    // without this, console logs in the plotly.js code don't print to
+    // the terminal since karma v1.5.0
+    //
+    // See https://github.com/karma-runner/karma/commit/89a7a1c#commitcomment-21009216
+    func.defaultConfig.browserConsoleLogOptions = {
+        level: 'log'
+    };
+
     config.set(func.defaultConfig);
 }
 

test/jasmine/tests/gl2d_click_test.js

@@ -371,38 +371,50 @@ describe('Test hover and click interactions', function() {
 
             var modifiedMockCopy = Lib.extendDeep({}, mock4);
 
-            Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
-                .then(new Promise(function() {
-
-                    gd.on('plotly_hover', function(data) {
-                        futureData = data;
-                    });
-
-                    hover(435, 216);
-
-                    window.setTimeout(function() {
-
-                        expect(futureData.points.length).toEqual(1);
-
-                        var pt = futureData.points[0];
+            function _hover() {
+                hover(435, 216);
 
-                        expect(Object.keys(pt)).toEqual([
-                            'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
-                        ]);
-
-                        expect(pt.x).toEqual(8);
-                        expect(pt.y).toEqual(18);
-                        expect(pt.curveNumber).toEqual(2);
-                        expect(pt.pointNumber).toEqual(0);
-                        expect(pt.fullData.length).toEqual(3);
-                        expect(typeof pt.data.uid).toEqual('string');
-                        expect(pt.xaxis.domain.length).toEqual(2);
-                        expect(pt.yaxis.domain.length).toEqual(2);
+                return new Promise(function(resolve) {
+                    setTimeout(resolve, 350);
+                });
+            }
 
-                        done();
-                    }, 350);
-                }));
+            Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout).then(function() {
+                gd.on('plotly_hover', function(data) {
+                    futureData = data;
+                });
+            })
+            .then(_hover)
+            .then(function() {
+                expect(futureData.points.length).toEqual(1);
+
+                var pt = futureData.points[0];
+
+                expect(Object.keys(pt)).toEqual([
+                    'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
+                ]);
+
+                expect(pt.x).toEqual(8);
+                expect(pt.y).toEqual(18);
+                expect(pt.curveNumber).toEqual(2);
+                expect(pt.pointNumber).toEqual(0);
+                expect(pt.fullData.length).toEqual(3);
+                expect(typeof pt.data.uid).toEqual('string');
+                expect(pt.xaxis.domain.length).toEqual(2);
+                expect(pt.yaxis.domain.length).toEqual(2);
+
+                return Plotly.restyle(gd, 'visible', false, [1, 2]);
+            })
+            .then(_hover)
+            .then(function() {
+                var pt = futureData.points[0];
+
+                expect(pt.x).toEqual(8);
+                expect(pt.y).toEqual(18);
+                expect(pt.curveNumber).toEqual(2, 'matches input data index');
+                expect(pt.pointNumber).toEqual(0);
+            })
+            .then(done);
         });
 
         it('scattergl-fancy', function(done) {