Scattergl lasso

package.json

@@ -85,6 +85,7 @@
     "mapbox-gl": "^0.22.0",
     "matrix-camera-controller": "^2.1.3",
     "mouse-change": "^1.4.0",
+    "mouse-event-offset": "^3.0.2",
     "mouse-wheel": "^1.0.2",
     "ndarray": "^1.0.18",
     "ndarray-fill": "^1.0.2",

src/components/modebar/manage.js

@@ -72,7 +72,6 @@ module.exports = function manageModeBar(gd) {
 function getButtonGroups(gd, buttonsToRemove, buttonsToAdd) {
     var fullLayout = gd._fullLayout,
         fullData = gd._fullData;
-
     var hasCartesian = fullLayout._has('cartesian'),
         hasGL3D = fullLayout._has('gl3d'),
         hasGeo = fullLayout._has('geo'),
@@ -121,7 +120,7 @@ function getButtonGroups(gd, buttonsToRemove, buttonsToAdd) {
     if(((hasCartesian || hasGL2D) && !allAxesFixed) || hasTernary) {
         dragModeGroup = ['zoom2d', 'pan2d'];
     }
-    if((hasCartesian || hasTernary) && isSelectable(fullData)) {
+    if((hasCartesian || hasTernary || hasGL2D) && isSelectable(fullData)) {
         dragModeGroup.push('select2d');
         dragModeGroup.push('lasso2d');
     }
@@ -173,7 +172,7 @@ function isSelectable(fullData) {
 
         if(!trace._module || !trace._module.selectPoints) continue;
 
-        if(trace.type === 'scatter' || trace.type === 'scatterternary') {
+        if(trace.type === 'scatter' || trace.type === 'scatterternary' || trace.type === 'scattergl') {
             if(scatterSubTypes.hasMarkers(trace) || scatterSubTypes.hasText(trace)) {
                 selectable = true;
             }

src/plot_api/plot_api.js

@@ -187,7 +187,6 @@ Plotly.plot = function(gd, data, layout, config) {
                 basePlotModules[i].drawFramework(gd);
             }
         }
-
         return Lib.syncOrAsync([
             subroutines.layoutStyles,
             drawAxes,
@@ -1790,7 +1789,9 @@ Plotly.relayout = function relayout(gd, astr, val) {
         flags = specs.flags;
 
     // clear calcdata if required
-    if(flags.docalc) gd.calcdata = undefined;
+    if(flags.docalc) {
+        gd.calcdata = undefined;
+    }
 
     // fill in redraw sequence
 

src/plots/cartesian/axes.js

@@ -365,7 +365,11 @@ axes.doAutoRange = function(ax) {
     var hasDeps = (ax._min && ax._max && ax._min.length && ax._max.length);
 
     if(ax.autorange && hasDeps) {
-        ax.range = axes.getAutoRange(ax);
+        // FIXME: scattergl calls it in async fashion, hence there is .range and _._rl mess
+        ax.range = ax._rl = axes.getAutoRange(ax);
+
+        ax._r = ax.range.slice();
+        ax._rl = Lib.simpleMap(ax._r, ax.r2l);
 
         // doAutoRange will get called on fullLayout,
         // but we want to report its results back to layout

src/plots/cartesian/dragbox.js

@@ -79,7 +79,7 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
         var yIDs = [ya0._id];
 
         // if we're dragging two axes at once, also drag overlays
-        subplots = [plotinfo].concat((ns && ew) ? plotinfo.overlays : []);
+        subplots = [plotinfo].concat((ns && ew && plotinfo.overlays) ? plotinfo.overlays : []);
 
         for(var i = 1; i < subplots.length; i++) {
             var subplotXa = subplots[i].xaxis,
@@ -170,7 +170,6 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
             }
         }
     };
-
     dragElement.init(dragOptions);
 
     var x0,
@@ -387,7 +386,9 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
             var axRange = Lib.simpleMap(ax.range, ax.r2l),
                 v0 = axRange[0] + (axRange[1] - axRange[0]) * centerFraction;
             function doZoom(v) { return ax.l2r(v0 + (v - v0) * zoom); }
+
             ax.range = axRange.map(doZoom);
+
         }
 
         if(ew || isSubplotConstrained) {
@@ -443,7 +444,6 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
         }
 
         recomputeAxisLists();
-
         if(xActive === 'ew' || yActive === 'ns') {
             if(xActive) dragAxList(xa, dx);
             if(yActive) dragAxList(ya, dy);
@@ -504,6 +504,7 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
                 // scale the other axis the same about its middle
                 for(i = 0; i < xa.length; i++) {
                     xa[i].range = xa[i]._r.slice();
+
                     scaleZoom(xa[i], 1 - dy / ph);
                 }
                 dx = dy * pw / ph;
@@ -512,6 +513,7 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
             if(!yActive && xActive.length === 1) {
                 for(i = 0; i < ya.length; i++) {
                     ya[i].range = ya[i]._r.slice();
+
                     scaleZoom(ya[i], 1 - dx / pw);
                 }
                 dy = dx * ph / pw;
@@ -631,7 +633,6 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
                 }
             }
         }
-
         gd.emit('plotly_doubleclick', null);
         Plotly.relayout(gd, attrs);
     }
@@ -654,6 +655,7 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
             if(axi._r[1] !== axi.range[1]) attrs[axi._name + '.range[1]'] = axi.range[1];
 
             axi.range = axi._input.range = axi._r.slice();
+
         }
 
         updateSubplots([0, 0, pw, ph]);
@@ -690,7 +692,9 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
 
         function scaleAndGetShift(ax, scaleFactor) {
             if(scaleFactor) {
+
                 ax.range = ax._r.slice();
+
                 scaleZoom(ax, scaleFactor);
                 return ax._length * (1 - scaleFactor) / 2;
             }
@@ -811,10 +815,12 @@ function zoomAxRanges(axList, r0Fraction, r1Fraction, linkedAxes) {
 
         axRangeLinear0 = axi._rl[0];
         axRangeLinearSpan = axi._rl[1] - axRangeLinear0;
+
         axi.range = [
             axi.l2r(axRangeLinear0 + axRangeLinearSpan * r0Fraction),
             axi.l2r(axRangeLinear0 + axRangeLinearSpan * r1Fraction)
         ];
+
     }
 
     // zoom linked axes about their centers
@@ -829,6 +835,7 @@ function dragAxList(axList, pix) {
     for(var i = 0; i < axList.length; i++) {
         var axi = axList[i];
         if(!axi.fixedrange) {
+
             axi.range = [
                 axi.l2r(axi._rl[0] - pix / axi._m),
                 axi.l2r(axi._rl[1] - pix / axi._m)

src/plots/cartesian/graph_interact.js

@@ -20,7 +20,7 @@ var dragBox = require('./dragbox');
 module.exports = function initInteractions(gd) {
     var fullLayout = gd._fullLayout;
 
-    if(!fullLayout._has('cartesian') || gd._context.staticPlot) return;
+    if((!fullLayout._has('cartesian') && !fullLayout._has('gl2d')) || gd._context.staticPlot) return;
 
     var subplots = Object.keys(fullLayout._plots || {}).sort(function(a, b) {
         // sort overlays last, then by x axis number, then y axis number
@@ -38,7 +38,7 @@ module.exports = function initInteractions(gd) {
     subplots.forEach(function(subplot) {
         var plotinfo = fullLayout._plots[subplot];
 
-        if(!fullLayout._has('cartesian')) return;
+        // if(!fullLayout._has('cartesian')) return;
 
         var xa = plotinfo.xaxis,
             ya = plotinfo.yaxis,

src/plots/cartesian/index.js

@@ -184,6 +184,9 @@ exports.clean = function(newFullData, newFullLayout, oldFullData, oldFullLayout)
             oldFullLayout._infolayer.select('.' + axIds[i] + 'title').remove();
         }
     }
+
+    //clean selection
+    oldFullLayout._zoomlayer.selectAll('.select-outline').remove();
 };
 
 exports.drawFramework = function(gd) {
@@ -281,7 +284,6 @@ function makeSubplotData(gd) {
             subplotData.push(subplot);
         }
     }
-
     // main subplots before overlays
     subplotData = subplotData.concat(overlays);
 

src/plots/cartesian/scale_zoom.js

@@ -15,7 +15,6 @@ module.exports = function scaleZoom(ax, factor, centerFraction) {
     var rangeLinear = [ax.r2l(ax.range[0]), ax.r2l(ax.range[1])];
     var center = rangeLinear[0] + (rangeLinear[1] - rangeLinear[0]) * centerFraction;
     var newHalfSpan = (center - rangeLinear[0]) * factor;
-
     ax.range = ax._input.range = [
         ax.l2r(center - newHalfSpan),
         ax.l2r(center + newHalfSpan)