diff --git a/package-lock.json b/package-lock.json index 88bdf90f11b..23389250ccc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4653,9 +4653,9 @@ } }, "gl-plot3d": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/gl-plot3d/-/gl-plot3d-2.2.1.tgz", - "integrity": "sha512-WSzZ9118mUal3uW/9bCPqdrlncmD/T0zWoOY9PiskIOAJ5dxKhzPbY2XkjDs+jGh/ce1yCSEh6LO9aB9SirGow==", + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/gl-plot3d/-/gl-plot3d-2.2.2.tgz", + "integrity": "sha512-is8RoDVUEbUM7kJ2qjhKJlfGLECH3ML9pTCW1V7ylUdmUACmcZ4lzJrQr/NIRkHC5WcUNOp3QJKPjBND3ngZ2A==", "requires": { "3d-view": "^2.0.0", "a-big-triangle": "^1.0.3", @@ -4664,10 +4664,10 @@ "gl-mat4": "^1.2.0", "gl-select-static": "^2.0.4", "gl-shader": "^4.2.1", - "gl-spikes3d": "^1.0.8", + "gl-spikes3d": "^1.0.9", "glslify": "^7.0.0", "has-passive-events": "^1.0.0", - "is-mobile": "^2.0.0", + "is-mobile": "^2.1.0", "mouse-change": "^1.4.0", "mouse-event-offset": "^3.0.2", "mouse-wheel": "^1.2.0", @@ -4749,9 +4749,9 @@ "integrity": "sha512-QVeOZsi9nQuJJl7NB3132CCv5KA10BWxAY2QgJNsKqbLsG53B/TrGJpjIAohnJftdZ4fT6b3ZojWgeaXk8bOOA==" }, "gl-spikes3d": { - "version": "1.0.8", - "resolved": "https://registry.npmjs.org/gl-spikes3d/-/gl-spikes3d-1.0.8.tgz", - "integrity": "sha512-C9Ij2/vpyjFGQBO2dDG4WsS8ZLWbFdL+nnqBeWqYe8SER96R+ZBMH/wddwZsxPV2iKlK9x2a8z3fSohw6V8Ayg==", + "version": "1.0.9", + "resolved": "https://registry.npmjs.org/gl-spikes3d/-/gl-spikes3d-1.0.9.tgz", + "integrity": "sha512-laMxydgGdnE8kvd1YD9cNWrx0uSmrPj1Oi02cHhnxWIklut97w3F7mZKnmLMEyUkxpRLkEeQ7YkYy7Y+aUEblw==", "requires": { "gl-buffer": "^2.1.2", "gl-shader": "^4.2.1", @@ -5930,9 +5930,9 @@ "integrity": "sha1-HXK8ZtP+Iur2Fw3ajPEJQySM/HY=" }, "is-mobile": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/is-mobile/-/is-mobile-2.0.0.tgz", - "integrity": "sha512-k2+p7BBCzhqHMdYJwGUNNo+6zegGiMIVbM6bEPzxWXpQV6BUzV892UW0oDFgqxT6DygO7LdxRbwC0xmOhJdbew==" + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-mobile/-/is-mobile-2.1.0.tgz", + "integrity": "sha512-M5OhlZwh+aTlmRUvDg0Wq3uWVNa+w4DyZ2SjbrS+BhSLu9Po+JXHendC305ZEu+Hh7lywb19Zu4kYXu3L1Oo8A==" }, "is-number": { "version": "3.0.0", diff --git a/package.json b/package.json index df566bbee13..1f5f1a851a0 100644 --- a/package.json +++ b/package.json @@ -80,7 +80,7 @@ "gl-mat4": "^1.2.0", "gl-mesh3d": "^2.1.1", "gl-plot2d": "^1.4.2", - "gl-plot3d": "^2.2.1", + "gl-plot3d": "^2.2.2", "gl-pointcloud2d": "^1.0.2", "gl-scatter3d": "^1.2.2", "gl-select-box": "^1.0.3", diff --git a/test/image/baselines/gl3d_transparent_same-depth.png b/test/image/baselines/gl3d_transparent_same-depth.png new file mode 100644 index 00000000000..b0757516867 Binary files /dev/null and b/test/image/baselines/gl3d_transparent_same-depth.png differ diff --git a/test/image/mocks/gl3d_transparent_same-depth.json b/test/image/mocks/gl3d_transparent_same-depth.json new file mode 100644 index 00000000000..626828453ce --- /dev/null +++ b/test/image/mocks/gl3d_transparent_same-depth.json @@ -0,0 +1,107 @@ +{ + "data": [ + { + "x": [ + 0, + 1, + 1, + 0, + 0, + 1, + 1, + 0 + ], + "y": [ + 0, + 0, + 1, + 1, + 0, + 0, + 1, + 1 + ], + "z": [ + 0, + 0, + 0, + 0, + 0, + 0, + 0, + 0 + ], + "text": [ + "first below", + "second below", + "third below", + "fourth below", + "first above", + "second above", + "third above", + "fourth above" + ], + "type": "scatter3d", + "opacity": 0.5, + "marker": { + "opacity": 0.5, + "size": 50 + } + }, + { + "x": [ + 0, + 1, + 1, + 0, + 0, + 1, + 1, + 0 + ], + "y": [ + 0, + 0, + 1, + 1, + 0, + 0, + 1, + 1 + ], + "z": [ + 1, + 1, + 1, + 1, + 1, + 1, + 1, + 1 + ], + "text": [ + "first below", + "second below", + "third below", + "fourth below", + "first above", + "second above", + "third above", + "fourth above" + ], + "type": "scatter3d", + "opacity": 0.5, + "marker": { + "opacity": 0.5, + "size": 50 + } + } + ], + "layout": { + "width": 400, + "height": 400, + "title": { + "text": "hover should generally pick latest
points on the same position
and display above not below" + } + } +} diff --git a/test/jasmine/tests/gl3d_hover_click_test.js b/test/jasmine/tests/gl3d_hover_click_test.js index 2492b76a8f0..34ff57afc14 100644 --- a/test/jasmine/tests/gl3d_hover_click_test.js +++ b/test/jasmine/tests/gl3d_hover_click_test.js @@ -24,6 +24,7 @@ mock2.data[0].surfaceaxis = 2; mock2.layout.showlegend = true; var mock3 = require('@mocks/gl3d_autocolorscale'); +var mock4 = require('@mocks/gl3d_transparent_same-depth.json'); describe('Test gl3d trace click/hover:', function() { var gd, ptData; @@ -39,13 +40,16 @@ describe('Test gl3d trace click/hover:', function() { destroyGraphDiv(); }); - function assertHoverText(xLabel, yLabel, zLabel, textLabel) { + function assertHoverText(xLabel, yLabel, zLabel, textLabel, traceName) { var content = []; if(xLabel) content.push(xLabel); if(yLabel) content.push(yLabel); if(zLabel) content.push(zLabel); if(textLabel) content.push(textLabel); - assertHoverLabelContent({nums: content.join('\n')}); + assertHoverLabelContent({ + name: traceName, + nums: content.join('\n') + }); } function assertEventData(x, y, z, curveNumber, pointNumber, extra) { @@ -539,4 +543,29 @@ describe('Test gl3d trace click/hover:', function() { .catch(failTest) .then(done); }); + + it('@gl should pick latest & closest points on hover if two points overlap', function(done) { + var _mock = Lib.extendDeep({}, mock4); + + function _hover() { + mouseEvent('mouseover', 0, 0); + mouseEvent('mouseover', 200, 200); + } + + Plotly.plot(gd, _mock) + .then(delay(20)) + .then(function() { + gd.on('plotly_hover', function(eventData) { + ptData = eventData.points[0]; + }); + }) + .then(delay(20)) + .then(_hover) + .then(delay(20)) + .then(function() { + assertHoverText('x: 1', 'y: 1', 'z: 1', 'third above', 'trace 1'); + }) + .catch(failTest) + .then(done); + }); });