Merge branch 'splom-feature' into splom-zoom-perf

Author: etpinard

package-lock.json

@@ -100,7 +100,7 @@
     "regl": "^1.3.1",
     "regl-error2d": "^2.0.3",
     "regl-line2d": "github:dy/regl-line2d",
-    "regl-scatter2d": "^3.0.0",
+    "regl-scatter2d": "github:dy/regl-scatter2d",
     "regl-scattermatrix": "github:dy/regl-scattermatrix",
     "right-now": "^1.0.0",
     "robust-orientation": "^1.1.3",

package.json

@@ -185,6 +185,10 @@ function sizeDefaults(layoutIn, layoutOut) {
     var hasSubplotGrid = Array.isArray(gridIn.subplots) && Array.isArray(gridIn.subplots[0]);
     var hasXaxes = Array.isArray(xAxes);
     var hasYaxes = Array.isArray(yAxes);
+    var isSplomGenerated = (
+        hasXaxes && xAxes !== gridIn.xaxes &&
+        hasYaxes && yAxes !== gridIn.yaxes
+    );
 
     var dfltRows, dfltColumns;
 
@@ -217,17 +221,26 @@ function sizeDefaults(layoutIn, layoutOut) {
     var rowOrder = coerce('roworder');
     var reversed = rowOrder === 'top to bottom';
 
+    var dfltGapX = hasSubplotGrid ? 0.2 : 0.1;
+    var dfltGapY = hasSubplotGrid ? 0.3 : 0.1;
+
+    var dfltSideX, dfltSideY;
+    if(isSplomGenerated) {
+        dfltSideX = 'bottom';
+        dfltSideY = 'left';
+    }
+
     gridOut._domains = {
-        x: fillGridPositions('x', coerce, hasSubplotGrid ? 0.2 : 0.1, columns),
-        y: fillGridPositions('y', coerce, hasSubplotGrid ? 0.3 : 0.1, rows, reversed)
+        x: fillGridPositions('x', coerce, dfltGapX, dfltSideX, columns),
+        y: fillGridPositions('y', coerce, dfltGapY, dfltSideY, rows, reversed)
     };
 }
 
 // coerce x or y sizing attributes and return an array of domains for this direction
-function fillGridPositions(axLetter, coerce, dfltGap, len, reversed) {
+function fillGridPositions(axLetter, coerce, dfltGap, dfltSide, len, reversed) {
     var dirGap = coerce(axLetter + 'gap', dfltGap);
     var domain = coerce('domain.' + axLetter);
-    coerce(axLetter + 'side');
+    coerce(axLetter + 'side', dfltSide);
 
     var out = new Array(len);
     var start = domain[0];

src/components/grid/index.js

@@ -83,7 +83,7 @@ module.exports = function style(s, gd) {
     function stylePoints(d) {
         var d0 = d[0],
             trace = d0.trace,
-            showMarkers = subTypes.hasMarkers(trace),
+            showMarkers = subTypes.hasMarkers(trace) || trace.type === 'splom',
             showText = subTypes.hasText(trace),
             showLines = subTypes.hasLines(trace);
 

src/components/legend/style.js

@@ -45,7 +45,8 @@ module.exports = function prepSelect(e, startX, startY, dragOptions, mode) {
         yAxisIds = dragOptions.yaxes.map(getAxId),
         allAxes = dragOptions.xaxes.concat(dragOptions.yaxes),
         filterPoly, testPoly, mergedPolygons, currentPolygon,
-        subtract = e.altKey;
+        subtract = e.altKey,
+        i, cd, trace, searchInfo, eventData;
 
 
     // take over selection polygons from prev mode, if any
@@ -63,6 +64,20 @@ module.exports = function prepSelect(e, startX, startY, dragOptions, mode) {
     if(mode === 'lasso') {
         filterPoly = filteredPolygon([[x0, y0]], constants.BENDPX);
     }
+
+    // FIXME: find a better way to clear selection outlines for splom
+    if(!e.shiftKey && !e.altKey) {
+        for(i = 0; i < gd.calcdata.length; i++) {
+            cd = gd.calcdata[i];
+            trace = cd[0].trace;
+
+            if(trace.type === 'splom') {
+                zoomLayer.selectAll('.select-outline').remove();
+                break;
+            }
+        }
+    }
+
     var outlines = zoomLayer.selectAll('path.select-outline-' + plotinfo.id).data([1, 2]);
 
     outlines.enter()
@@ -86,7 +101,6 @@ module.exports = function prepSelect(e, startX, startY, dragOptions, mode) {
     var searchTraces = [];
     var throttleID = fullLayout._uid + constants.SELECTID;
     var selection = [];
-    var i, cd, trace, searchInfo, eventData;
 
     for(i = 0; i < gd.calcdata.length; i++) {
         cd = gd.calcdata[i];
@@ -355,6 +369,9 @@ function updateSelectedState(gd, searchTraces, eventData) {
                 searchTraces[i].cd[0].t.scene.clearSelect();
             }
         }
+
+        // FIXME: make sure there is no better way to clear selection for sploms
+        gd._fullLayout._zoomlayer.selectAll('.select-outline').remove();
     }
 
     for(i = 0; i < searchTraces.length; i++) {

src/plots/cartesian/select.js

@@ -291,7 +291,7 @@ plots.supplyDefaults = function(gd) {
 
     var context = gd._context || {};
 
-    var i, j;
+    var i;
 
     // Create all the storage space for frames, but only if doesn't already exist
     if(!gd._transitionData) plots.createTransitionData(gd);
@@ -366,7 +366,10 @@ plots.supplyDefaults = function(gd) {
     newFullLayout._modules = [];
     newFullLayout._basePlotModules = [];
     var subplots = newFullLayout._subplots = emptySubplotLists();
+
+    // initialize axis and subplot hash objects for splom-generated grids
     var splomAxes = newFullLayout._splomAxes = {x: {}, y: {}};
+    var splomSubplots = newFullLayout._splomSubplots = {};
 
     // then do the data
     newFullLayout._globalTransforms = (gd._context || {}).globalTransforms;
@@ -381,10 +384,12 @@ plots.supplyDefaults = function(gd) {
 
         for(i = 0; i < splomXa.length; i++) {
             Lib.pushUnique(subplots.xaxis, splomXa[i]);
-            for(j = 0; j < splomYa.length; j++) {
-                if(i === 0) Lib.pushUnique(subplots.yaxis, splomYa[j]);
-                Lib.pushUnique(subplots.cartesian, splomXa[i] + splomYa[j]);
-            }
+        }
+        for(i = 0; i < splomYa.length; i++) {
+            Lib.pushUnique(subplots.yaxis, splomYa[i]);
+        }
+        for(var k in splomSubplots) {
+            Lib.pushUnique(subplots.cartesian, k);
         }
     }
 

src/plots/plots.js

@@ -50,6 +50,9 @@ function convertStyle(gd, trace) {
                 opts.unselected.opacity[i] = DESELECTDIM * mo[i];
             }
         }
+
+        // FIXME: if only trace.selected provided, trace.unselected remains empty
+        // cc @etienne
     }
 
     if(subTypes.hasLines(trace)) {
@@ -402,6 +405,7 @@ function convertErrorBarPositions(gd, trace, positions) {
 module.exports = {
     convertStyle: convertStyle,
     convertMarkerStyle: convertMarkerStyle,
+    convertMarkerSelection: convertMarkerSelection,
     convertLinePositions: convertLinePositions,
     convertErrorBarPositions: convertErrorBarPositions
 };

src/traces/scattergl/convert.js

@@ -68,14 +68,11 @@ module.exports = {
         editType: 'calc+clearAxisTypes'
     },
 
-    mode: scatterGlAttrs.mode,
-    text: scatterGlAttrs.text,
+    // mode: {}, (only 'markers' for now)
 
+    text: scatterGlAttrs.text,
     marker: scatterGlAttrs.marker,
 
-    line: scatterGlAttrs.line,
-    connectgaps: scatterGlAttrs.connectgaps,
-
     xaxes: makeAxesValObject('x'),
     yaxes: makeAxesValObject('y'),
 
@@ -84,7 +81,7 @@ module.exports = {
             valType: 'boolean',
             role: 'info',
             dflt: true,
-            editType: 'plot',
+            editType: 'calc',
             description: [
                 'Determines whether or not subplots on the diagonal are displayed.'
             ].join(' ')
@@ -101,7 +98,7 @@ module.exports = {
         valType: 'boolean',
         role: 'info',
         dflt: true,
-        editType: 'plot',
+        editType: 'calc',
         description: [
             'Determines whether or not subplots on the upper half',
             'from the diagonal are displayed.'
@@ -111,15 +108,19 @@ module.exports = {
         valType: 'boolean',
         role: 'info',
         dflt: true,
-        editType: 'plot',
+        editType: 'calc',
         description: [
             'Determines whether or not subplots on the lower half',
             'from the diagonal are displayed.'
         ].join(' ')
     },
 
-    selected: scatterGlAttrs.selected,
-    unselected: scatterGlAttrs.unselected,
+    selected: {
+        marker: scatterGlAttrs.selected.marker
+    },
+    unselected: {
+        marker: scatterGlAttrs.unselected.marker
+    },
 
     opacity: scatterGlAttrs.opacity
 };

src/traces/splom/attributes.js

@@ -37,32 +37,52 @@ function drag(gd) {
     var cd = gd.calcdata;
     var fullLayout = gd._fullLayout;
 
+    if(fullLayout._hasOnlyLargeSploms) {
+        drawGrid(gd);
+    }
+
     for(var i = 0; i < cd.length; i++) {
         var cd0 = cd[i][0];
         var trace = cd0.trace;
         var scene = cd0.t._scene;
 
         if(trace.type === 'splom' && scene && scene.matrix) {
-            var activeLength = trace._activeLength;
-            var visibleLength = scene.matrixOptions.data.length;
-            var ranges = new Array(visibleLength);
-            var k = 0;
-
-            for(var j = 0; j < activeLength; j++) {
-                if(trace.dimensions[j].visible) {
-                    var xrng = AxisIDs.getFromId(gd, trace.xaxes[j]).range;
-                    var yrng = AxisIDs.getFromId(gd, trace.yaxes[j]).range;
-                    ranges[k++] = [xrng[0], yrng[0], xrng[1], yrng[1]];
-                }
+            dragOne(gd, trace, scene);
+        }
+    }
+}
+
+function dragOne(gd, trace, scene) {
+    var dimensions = trace.dimensions;
+    var visibleLength = scene.matrixOptions.data.length;
+    var ranges = new Array(visibleLength);
+
+    for(var i = 0, k = 0; i < dimensions.length; i++) {
+        if(dimensions[i].visible) {
+            var rng = ranges[k] = new Array(4);
+
+            var xa = AxisIDs.getFromId(gd, trace._diag[i][0]);
+            if(xa) {
+                rng[0] = xa.range[0];
+                rng[2] = xa.range[1];
             }
 
-            scene.matrix.update({ranges: ranges});
-            scene.matrix.draw();
+            var ya = AxisIDs.getFromId(gd, trace._diag[i][1]);
+            if(ya) {
+                rng[1] = ya.range[0];
+                rng[3] = ya.range[1];
+            }
+
+            k++;
         }
     }
 
-    if(fullLayout._hasOnlyLargeSploms) {
-        drawGrid(gd);
+    if(scene.selectBatch) {
+        scene.matrix.update({ranges: ranges}, {ranges: ranges});
+        scene.matrix.draw(scene.unselectBatch, scene.selectBatch);
+    } else {
+        scene.matrix.update({ranges: ranges});
+        scene.matrix.draw();
     }
 }