Introducing splom traces

lib/index-gl2d.js

@@ -12,6 +12,7 @@ var Plotly = require('./core');
 
 Plotly.register([
     require('./scattergl'),
+    require('./splom'),
     require('./pointcloud'),
     require('./heatmapgl'),
     require('./contourgl'),

lib/index.js

@@ -31,6 +31,8 @@ Plotly.register([
     require('./choropleth'),
 
     require('./scattergl'),
+    require('./splom'),
+
     require('./pointcloud'),
     require('./heatmapgl'),
     require('./parcoords'),

lib/splom.js

@@ -0,0 +1,11 @@
+/**
+* Copyright 2012-2018, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+module.exports = require('../src/traces/splom');

package.json

@@ -101,6 +101,7 @@
     "regl-error2d": "^2.0.3",
     "regl-line2d": "^2.1.5",
     "regl-scatter2d": "^3.0.0",
+    "regl-scattermatrix": "github:dfcreative/regl-scattermatrix",
     "right-now": "^1.0.0",
     "robust-orientation": "^1.1.3",
     "sane-topojson": "^2.0.0",

src/components/fx/hover.js

@@ -265,7 +265,8 @@ function _hover(gd, evt, subplot, noHoverEvent) {
         for(curvenum = 0; curvenum < gd.calcdata.length; curvenum++) {
             cd = gd.calcdata[curvenum];
             trace = cd[0].trace;
-            if(trace.hoverinfo !== 'skip' && subplots.indexOf(helpers.getSubplot(trace)) !== -1) {
+            // FIXME: find more efficient way to check splom trace
+            if((trace.hoverinfo !== 'skip' && subplots.indexOf(helpers.getSubplot(trace)) !== -1) || trace.type === 'splom') {
                 searchData.push(cd);
             }
         }

src/components/grid/index.js

@@ -165,15 +165,26 @@ var gridAttrs = {
     editType: 'plot'
 };
 
+function getAxes(layout, grid, axLetter) {
+    var gridVal = grid[axLetter + 'axes'];
+    var splomVal = Object.keys((layout._splomAxes || {})[axLetter] || {});
+
+    if(Array.isArray(gridVal)) return gridVal;
+    if(splomVal.length) return splomVal;
+}
+
 // the shape of the grid - this needs to be done BEFORE supplyDataDefaults
 // so that non-subplot traces can place themselves in the grid
 function sizeDefaults(layoutIn, layoutOut) {
-    var gridIn = layoutIn.grid;
-    if(!gridIn) return;
+    var gridIn = layoutIn.grid || {};
+    var xAxes = getAxes(layoutOut, gridIn, 'x');
+    var yAxes = getAxes(layoutOut, gridIn, 'y');
+
+    if(!layoutIn.grid && !xAxes && !yAxes) return;
 
     var hasSubplotGrid = Array.isArray(gridIn.subplots) && Array.isArray(gridIn.subplots[0]);
-    var hasXaxes = Array.isArray(gridIn.xaxes);
-    var hasYaxes = Array.isArray(gridIn.yaxes);
+    var hasXaxes = Array.isArray(xAxes);
+    var hasYaxes = Array.isArray(yAxes);
 
     var dfltRows, dfltColumns;
 
@@ -182,8 +193,8 @@ function sizeDefaults(layoutIn, layoutOut) {
         dfltColumns = gridIn.subplots[0].length;
     }
     else {
-        if(hasYaxes) dfltRows = gridIn.yaxes.length;
-        if(hasXaxes) dfltColumns = gridIn.xaxes.length;
+        if(hasYaxes) dfltRows = yAxes.length;
+        if(hasXaxes) dfltColumns = xAxes.length;
     }
 
     var gridOut = layoutOut.grid = {};
@@ -236,7 +247,7 @@ function contentDefaults(layoutIn, layoutOut) {
     // make sure we got to the end of handleGridSizing
     if(!gridOut || !gridOut._domains) return;
 
-    var gridIn = layoutIn.grid;
+    var gridIn = layoutIn.grid || {};
     var subplots = layoutOut._subplots;
     var hasSubplotGrid = gridOut._hasSubplotGrid;
     var rows = gridOut.rows;
@@ -282,8 +293,10 @@ function contentDefaults(layoutIn, layoutOut) {
         }
     }
     else {
-        gridOut.xaxes = fillGridAxes(gridIn.xaxes, subplots.xaxis, columns, axisMap, 'x');
-        gridOut.yaxes = fillGridAxes(gridIn.yaxes, subplots.yaxis, rows, axisMap, 'y');
+        var xAxes = getAxes(layoutOut, gridIn, 'x');
+        var yAxes = getAxes(layoutOut, gridIn, 'y');
+        gridOut.xaxes = fillGridAxes(xAxes, subplots.xaxis, columns, axisMap, 'x');
+        gridOut.yaxes = fillGridAxes(yAxes, subplots.yaxis, rows, axisMap, 'y');
     }
 
     var anchors = gridOut._anchors = {};

src/plot_api/plot_api.js

@@ -666,7 +666,7 @@ exports.newPlot = function(gd, data, layout, config) {
     gd = Lib.getGraphDiv(gd);
 
     // remove gl contexts
-    Plots.cleanPlot([], {}, gd._fullData || {}, gd._fullLayout || {});
+    Plots.cleanPlot([], {}, gd._fullData || {}, gd._fullLayout || {}, gd.calcdata || []);
 
     Plots.purge(gd);
     return exports.plot(gd, data, layout, config);
@@ -3234,11 +3234,12 @@ exports.deleteFrames = function(gd, frameList) {
 exports.purge = function purge(gd) {
     gd = Lib.getGraphDiv(gd);
 
-    var fullLayout = gd._fullLayout || {},
-        fullData = gd._fullData || [];
+    var fullLayout = gd._fullLayout || {};
+    var fullData = gd._fullData || [];
+    var calcdata = gd.calcdata || [];
 
     // remove gl contexts
-    Plots.cleanPlot([], {}, fullData, fullLayout);
+    Plots.cleanPlot([], {}, fullData, fullLayout, calcdata);
 
     // purge properties
     Plots.purge(gd);

src/plot_api/plot_schema.js

@@ -486,7 +486,7 @@ function getLayoutAttributes() {
 
         if(!_module.layoutAttributes) continue;
 
-        if(_module.name === 'cartesian') {
+        if(_module.name === 'cartesian' || _module.name === 'splom') {
             handleBasePlotModule(layoutAttributes, _module, 'xaxis');
             handleBasePlotModule(layoutAttributes, _module, 'yaxis');
         }

src/plots/cartesian/axis_defaults.js

@@ -34,6 +34,7 @@ var orderedCategories = require('./ordered_categories');
  */
 module.exports = function handleAxisDefaults(containerIn, containerOut, coerce, options, layoutOut) {
     var letter = options.letter;
+    var id = containerOut._id;
     var font = options.font || {};
 
     var visible = coerce('visible', !options.cheateronly);
@@ -74,8 +75,10 @@ module.exports = function handleAxisDefaults(containerIn, containerOut, coerce,
     // if axis.color was provided, use it for fonts too; otherwise,
     // inherit from global font color in case that was provided.
     var dfltFontColor = (dfltColor === containerIn.color) ? dfltColor : font.color;
+    // try to get default title from splom trace, fallback to graph-wide value
+    var dfltTitle = ((layoutOut._splomAxes || {})[letter] || {})[id] || layoutOut._dfltTitle[letter];
 
-    coerce('title', layoutOut._dfltTitle[letter]);
+    coerce('title', dfltTitle);
     Lib.coerceFont(coerce, 'titlefont', {
         family: font.family,
         size: Math.round(font.size * 1.2),

src/plots/cartesian/dragbox.js

@@ -715,13 +715,10 @@ function makeDragBox(gd, plotinfo, x, y, w, h, ns, ew) {
 
         // clear gl frame, if any, since we preserve drawing buffer
         // FIXME: code duplication with cartesian.plot
+        // TODO DRY this up!!
         if(fullLayout._glcanvas && fullLayout._glcanvas.size()) {
             fullLayout._glcanvas.each(function(d) {
-                if(d.regl) {
-                    d.regl.clear({
-                        color: true
-                    });
-                }
+                if(d.regl) d.regl.clear({color: true});
             });
         }
 
@@ -735,8 +732,8 @@ function makeDragBox(gd, plotinfo, x, y, w, h, ns, ew) {
             // scattergl translate
             if(subplot._scene && subplot._scene.update) {
                 // FIXME: possibly we could update axis internal _r and _rl here
-                var xaRange = Lib.simpleMap(xa2.range, xa2.r2l),
-                    yaRange = Lib.simpleMap(ya2.range, ya2.r2l);
+                var xaRange = Lib.simpleMap(xa2.range, xa2.r2l);
+                var yaRange = Lib.simpleMap(ya2.range, ya2.r2l);
                 subplot._scene.update(
                     {range: [xaRange[0], yaRange[0], xaRange[1], yaRange[1]]}
                 );
@@ -796,6 +793,10 @@ function makeDragBox(gd, plotinfo, x, y, w, h, ns, ew) {
             subplot.plot.selectAll('.barlayer .trace')
                 .call(Drawing.hideOutsideRangePoints, subplot, '.bartext');
         }
+
+        if(Registry.subplotsRegistry.splom) {
+            Registry.subplotsRegistry.splom.drag(gd);
+        }
     }
 
     return dragger;

src/plots/cartesian/graph_interact.js

@@ -26,7 +26,7 @@ module.exports = function initInteractions(gd) {
         return;
     }
 
-    if(!fullLayout._has('cartesian') && !fullLayout._has('gl2d')) return;
+    if(!fullLayout._has('cartesian') && !fullLayout._has('gl2d') && !fullLayout._has('splom')) return;
 
     var subplots = Object.keys(fullLayout._plots || {}).sort(function(a, b) {
         // sort overlays last, then by x axis number, then y axis number