first cut splom

Author: etpinard

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');

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 = layout[{x: '_splomXaxes', y: '_splomYaxes'}[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/plots/cartesian/index.js

@@ -226,7 +226,6 @@ exports.clean = function(newFullData, newFullLayout, oldFullData, oldFullLayout)
 
     var hadScatter, hasScatter, hadGl, hasGl, i, oldPlots, ids, subplotInfo, moduleName;
 
-
     for(i = 0; i < oldModules.length; i++) {
         moduleName = oldModules[i].name;
         if(moduleName === 'scatter') hadScatter = true;
@@ -272,8 +271,13 @@ exports.clean = function(newFullData, newFullLayout, oldFullData, oldFullLayout)
         }
     }
 
+    exports.cleanSubplots(newFullData, newFullLayout, oldFullData, oldFullLayout);
+};
+
+exports.cleanSubplots = function(newFullData, newFullLayout, oldFullData, oldFullLayout) {
     var oldSubplotList = oldFullLayout._subplots || {};
     var newSubplotList = newFullLayout._subplots || {xaxis: [], yaxis: []};
+    var i;
 
     // delete any titles we don't need anymore
     // check if axis list has changed, and if so clear old titles

src/plots/plots.js

@@ -289,7 +289,7 @@ plots.supplyDefaults = function(gd) {
 
     var context = gd._context || {};
 
-    var i;
+    var i, j;
 
     // Create all the storage space for frames, but only if doesn't already exist
     if(!gd._transitionData) plots.createTransitionData(gd);
@@ -321,7 +321,6 @@ plots.supplyDefaults = function(gd) {
 
     // first fill in what we can of layout without looking at data
     // because fullData needs a few things from layout
-
     if(oldFullLayout._initialAutoSizeIsDone) {
 
         // coerce the updated layout while preserving width and height
@@ -364,12 +363,28 @@ plots.supplyDefaults = function(gd) {
     // clear the lists of trace and baseplot modules, and subplots
     newFullLayout._modules = [];
     newFullLayout._basePlotModules = [];
-    newFullLayout._subplots = emptySubplotLists();
+    var subplots = newFullLayout._subplots = emptySubplotLists();
+    var splomXaxes = newFullLayout._splomXaxes = [];
+    var splomYaxes = newFullLayout._splomYaxes = [];
 
     // then do the data
     newFullLayout._globalTransforms = (gd._context || {}).globalTransforms;
     plots.supplyDataDefaults(newData, newFullData, newLayout, newFullLayout);
 
+    // redo grid size defaults with info about splom x/y axes,
+    // and fill in generated cartesian axes and subplots
+    if(splomXaxes.length && splomYaxes.length) {
+        Registry.getComponentMethod('grid', 'sizeDefaults')(newLayout, newFullLayout);
+
+        for(i = 0; i < splomXaxes.length; i++) {
+            Lib.pushUnique(subplots.xaxis, splomXaxes[i]);
+            for(j = 0; j < splomYaxes.length; j++) {
+                if(i === 0) Lib.pushUnique(subplots.yaxis, splomYaxes[j]);
+                Lib.pushUnique(subplots.cartesian, splomXaxes[i] + splomYaxes[j]);
+            }
+        }
+    }
+
     // attach helper method to check whether a plot type is present on graph
     newFullLayout._has = plots._hasPlotType.bind(newFullLayout);
 
@@ -865,7 +880,8 @@ plots.supplyDataDefaults = function(dataIn, dataOut, layout, fullLayout) {
     var cnt = 0;
     var colorCnt = 0;
 
-    var i, fullTrace, trace;
+    var fullTrace, trace;
+    var i, j;
 
     fullLayout._transformModules = [];
 
@@ -904,7 +920,7 @@ plots.supplyDataDefaults = function(dataIn, dataOut, layout, fullLayout) {
         if(fullTrace.transforms && fullTrace.transforms.length) {
             var expandedTraces = applyTransforms(fullTrace, dataOut, layout, fullLayout);
 
-            for(var j = 0; j < expandedTraces.length; j++) {
+            for(j = 0; j < expandedTraces.length; j++) {
                 var expandedTrace = expandedTraces[j];
                 var fullExpandedTrace = plots.supplyTraceDefaults(expandedTrace, cnt, fullLayout, i);
 
@@ -1357,6 +1373,7 @@ plots.supplyLayoutModuleDefaults = function(layoutIn, layoutOut, fullData, trans
     var basePlotModules = layoutOut._basePlotModules;
     var component, i, _module;
 
+
     var Cartesian = Registry.subplotsRegistry.cartesian;
 
     // check if any components need to add more base plot modules

src/traces/splom/attributes.js

@@ -0,0 +1,118 @@
+/**
+* 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';
+
+var scatterGlAttrs = require('../scattergl/attributes');
+var cartesianIdRegex = require('../../plots/cartesian/constants').idRegex;
+
+function makeAxesValObject(axLetter) {
+    return {
+        valType: 'info_array',
+        freeLength: true,
+        role: 'info',
+        editType: 'calc',
+        items: {
+            valType: 'enumerated',
+            values: [cartesianIdRegex[axLetter].toString(), ''],
+            editType: 'plot'
+        },
+        description: [
+            '..'
+        ].join(' ')
+    };
+}
+
+module.exports = {
+    dimensions: {
+        _isLinkedToArray: 'dimension',
+
+        visible: {
+            valType: 'boolean',
+            role: 'info',
+            dflt: true,
+            editType: 'calc',
+        },
+        label: {
+            valType: 'string',
+            role: 'info',
+            editType: 'calc',
+            description: ''
+        },
+        values: {
+            valType: 'data_array',
+            role: 'info',
+            editType: 'calc+clearAxisTypes',
+            description: [
+                ''
+            ].join(' ')
+        },
+
+        // TODO should add an attribute to pin down x only vars and y only vars
+        // like https://seaborn.pydata.org/generated/seaborn.pairplot.html
+        // x_vars and y_vars
+
+        editType: 'calc+clearAxisTypes',
+        description: [
+            '..'
+        ].join(' ')
+    },
+
+    mode: scatterGlAttrs.mode,
+    text: scatterGlAttrs.text,
+
+    marker: scatterGlAttrs.marker,
+
+    line: scatterGlAttrs.line,
+    connectgaps: scatterGlAttrs.connectgaps,
+
+    xdirection: {
+        valType: 'enumerated',
+        role: 'info',
+        values: ['right', 'left'],
+        dflt: 'right',
+        description: ''
+    },
+    ydirection: {
+        valType: 'enumerated',
+        role: 'info',
+        values: ['top', 'bottom'],
+        dflt: 'bottom',
+        description: ''
+    },
+
+    xaxes: makeAxesValObject('x'),
+    yaxes: makeAxesValObject('y'),
+
+    showdiagonal: {
+        valType: 'boolean',
+        role: 'info',
+        dlft: true,
+        editType: 'plot',
+        description: ''
+    },
+    showupperhalf: {
+        valType: 'boolean',
+        role: 'info',
+        dlft: true,
+        editType: 'plot',
+        description: ''
+    },
+    showlowerhalf: {
+        valType: 'boolean',
+        role: 'info',
+        dlft: true,
+        editType: 'plot',
+        description: ''
+    },
+
+    selected: scatterGlAttrs.selected,
+    unselected: scatterGlAttrs.unselected,
+
+    opacity: scatterGlAttrs.opacity
+};

src/traces/splom/base_plot.js

@@ -0,0 +1,48 @@
+/**
+* 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';
+
+var Registry = require('../../registry');
+var getModuleCalcData = require('../../plots/get_data').getModuleCalcData;
+var Cartesian = require('../../plots/cartesian');
+
+var SPLOM = 'splom';
+
+function plot(gd) {
+    var fullLayout = gd._fullLayout;
+    var _module = Registry.getModule(SPLOM);
+    var splomCalcData = getModuleCalcData(gd.calcdata, _module);
+
+    // clear gl frame, if any, since we preserve drawing buffer
+    if(fullLayout._glcanvas && fullLayout._glcanvas.size()) {
+        fullLayout._glcanvas.each(function(d) {
+            if(d.regl) d.regl.clear({color: true});
+        });
+    }
+
+    for(var i = 0; i < splomCalcData.length; i++) {
+        _module.plot(gd, {}, splomCalcData);
+    }
+
+}
+
+function clean(newFullData, newFullLayout, oldFullData, oldFullLayout) {
+    // TODO clear regl-splom instances
+
+    Cartesian.cleanSubplots(newFullData, newFullLayout, oldFullData, oldFullLayout);
+}
+
+module.exports = {
+    name: SPLOM,
+    supplyLayoutDefaults: Cartesian.supplyLayoutDefaults,
+    drawFramework: Cartesian.drawFramework,
+    plot: plot,
+    clean: clean,
+    toSVG: Cartesian.toSVG
+};