Merge pull request #160 from plotly/plot-index

Make Plotly.plot agnostic to plot modules

Author: etpinard

src/plot_api/plot_api.js

@@ -266,10 +266,12 @@ Plotly.plot = function(gd, data, layout, config) {
         // clean up old scenes that no longer have associated data
         // will this be a performance hit?
 
-        // ... until subplot of different type play better together
-        if(gd._fullLayout._hasGL3D) plotGl3d(gd);
-        if(gd._fullLayout._hasGeo) plotGeo(gd);
-        if(gd._fullLayout._hasGL2D) plotGl2d(gd);
+        var plotRegistry = plots.subplotsRegistry;
+
+        // TODO incorporate cartesian and polar plots into this paradigm
+        if(fullLayout._hasGL3D) plotRegistry.gl3d.plot(gd);
+        if(fullLayout._hasGeo) plotRegistry.geo.plot(gd);
+        if(fullLayout._hasGL2D) plotRegistry.gl2d.plot(gd);
 
         // in case of traces that were heatmaps or contour maps
         // previously, remove them and their colorbars explicitly
@@ -418,109 +420,6 @@ function setPlotContext(gd, config) {
     }
 }
 
-function plotGl3d(gd) {
-    var fullLayout = gd._fullLayout,
-        fullData = gd._fullData,
-        sceneIds = plots.getSubplotIds(fullLayout, 'gl3d');
-
-    var i, sceneId, fullSceneData, scene, sceneOptions;
-
-    fullLayout._paperdiv.style({
-        width: fullLayout.width + 'px',
-        height: fullLayout.height + 'px'
-    });
-
-    gd._context.setBackground(gd, fullLayout.paper_bgcolor);
-
-    for (i = 0; i < sceneIds.length; i++) {
-        sceneId = sceneIds[i];
-        fullSceneData = plots.getSubplotData(fullData, 'gl3d', sceneId);
-        scene = fullLayout[sceneId]._scene;  // ref. to corresp. Scene instance
-
-        // If Scene is not instantiated, create one!
-        if(scene === undefined) {
-            sceneOptions = {
-                container: gd.querySelector('.gl-container'),
-                id: sceneId,
-                staticPlot: gd._context.staticPlot,
-                plotGlPixelRatio: gd._context.plotGlPixelRatio
-            };
-            scene = new Plotly.Scene(sceneOptions, fullLayout);
-            fullLayout[sceneId]._scene = scene;  // set ref to Scene instance
-        }
-
-        scene.plot(fullSceneData, fullLayout, gd.layout);  // takes care of business
-    }
-}
-
-function plotGeo(gd) {
-    var fullLayout = gd._fullLayout,
-        fullData = gd._fullData,
-        geoIds = plots.getSubplotIds(fullLayout, 'geo');
-
-    var i, geoId, fullGeoData, geo;
-
-    // if 'plotly-geo-assets.js' is not included,
-    // initialize object to keep reference to every loaded topojson
-    if(window.PlotlyGeoAssets === undefined) {
-        window.PlotlyGeoAssets = { topojson : {} };
-    }
-
-    for (i = 0; i < geoIds.length; i++) {
-        geoId = geoIds[i];
-        fullGeoData = plots.getSubplotData(fullData, 'geo', geoId);
-        geo = fullLayout[geoId]._geo;
-
-        // If geo is not instantiated, create one!
-        if(geo === undefined) {
-            geo = new Plotly.Geo(
-                {
-                    id: geoId,
-                    container: fullLayout._geocontainer.node(),
-                    topojsonURL: gd._context.topojsonURL
-                },
-                fullLayout
-            );
-            fullLayout[geoId]._geo = geo;
-        }
-
-        geo.plot(fullGeoData, fullLayout, gd._promises);
-    }
-}
-
-function plotGl2d(gd) {
-    var fullLayout = gd._fullLayout,
-        fullData = gd._fullData,
-        subplotIds = plots.getSubplotIds(fullLayout, 'gl2d');
-
-    for(var i = 0; i < subplotIds.length; i++) {
-        var subplotId = subplotIds[i],
-            subplotObj = fullLayout._plots[subplotId],
-            fullSubplotData = plots.getSubplotData(fullData, 'gl2d', subplotId);
-        var scene;
-
-        // ref. to corresp. Scene instance
-        scene = subplotObj._scene2d;
-
-        // If Scene is not instantiated, create one!
-        if(scene === undefined) {
-            scene = new Plotly.Scene2D({
-                    container: gd.querySelector('.gl-container'),
-                    id: subplotId,
-                    staticPlot: gd._context.staticPlot,
-                    plotGlPixelRatio: gd._context.plotGlPixelRatio
-                },
-                fullLayout
-            );
-
-            // set ref to Scene instance
-            subplotObj._scene2d = scene;
-        }
-
-        scene.plot(fullSubplotData, fullLayout, gd.layout);
-    }
-}
-
 function plotPolar(gd, data, layout) {
     // build or reuse the container skeleton
     var plotContainer = d3.select(gd).selectAll('.plot-container')
@@ -866,8 +765,8 @@ function cleanData(data, existingData) {
         if(trace.yaxis) trace.yaxis = Plotly.Axes.cleanId(trace.yaxis, 'y');
 
         // scene ids scene1 -> scene
-        if (trace.scene) {
-            trace.scene = Plotly.Gl3dLayout.cleanId(trace.scene);
+        if(plots.traceIs(trace, 'gl3d') && trace.scene) {
+            trace.scene = plots.subplotsRegistry.gl3d.cleanId(trace.scene);
         }
 
         if(!plots.traceIs(trace, 'pie')) {
@@ -2593,10 +2492,8 @@ function makePlotFramework(gd) {
     var gd3 = d3.select(gd),
         fullLayout = gd._fullLayout;
 
-    /*
-     * TODO - find a better place for 3D to initialize axes
-     */
-    if(fullLayout._hasGL3D) Plotly.Gl3dLayout.initAxes(gd);
+    // TODO - find a better place for 3D to initialize axes
+    if(fullLayout._hasGL3D) plots.subplotsRegistry.gl3d.initAxes(gd);
 
     // Plot container
     fullLayout._container = gd3.selectAll('.plot-container').data([0]);

src/plot_api/plot_schema.js

@@ -10,10 +10,12 @@
 'use strict';
 
 var Plotly = require('../plotly');
+var Plots = require('../plots/plots');
+var Lib = require('../lib');
 
-var extendFlat = Plotly.Lib.extendFlat;
-var extendDeep = Plotly.Lib.extendDeep;
-var extendDeepAll = Plotly.Lib.extendDeepAll;
+var extendFlat = Lib.extendFlat;
+var extendDeep = Lib.extendDeep;
+var extendDeepAll = Lib.extendDeepAll;
 
 var NESTED_MODULE = '_nestedModules',
     COMPOSED_MODULE = '_composedModules',
@@ -38,7 +40,7 @@ var PlotSchema = module.exports = {};
 
 
 PlotSchema.get =  function() {
-    Plotly.Plots.allTypes
+    Plots.allTypes
         .concat('area')  // FIXME polar 'area' attributes
         .forEach(getTraceAttributes);
 
@@ -56,7 +58,7 @@ PlotSchema.crawl = function(attrs, callback) {
         callback(attr, attrName, attrs);
 
         if(PlotSchema.isValObject(attr)) return;
-        if(Plotly.Lib.isPlainObject(attr)) PlotSchema.crawl(attr, callback);
+        if(Lib.isPlainObject(attr)) PlotSchema.crawl(attr, callback);
     });
 };
 
@@ -65,7 +67,7 @@ PlotSchema.isValObject = function(obj) {
 };
 
 function getTraceAttributes(type) {
-    var globalAttributes = Plotly.Plots.attributes,
+    var globalAttributes = Plots.attributes,
         _module = getModule({type: type}),
         meta = getMeta(type),
         subplotRegistry = getSubplotRegistry(type);
@@ -111,7 +113,7 @@ function getTraceAttributes(type) {
 }
 
 function getLayoutAttributes() {
-    var globalLayoutAttributes = Plotly.Plots.layoutAttributes,
+    var globalLayoutAttributes = Plots.layoutAttributes,
         layoutAttributes = {};
 
     // layout module attributes (+ nested + composed)
@@ -136,7 +138,7 @@ function getLayoutAttributes() {
 
 function getDefs() {
     plotSchema.defs = {
-        valObjects: Plotly.Lib.valObjects,
+        valObjects: Lib.valObjects,
         metaKeys: UNDERSCORE_ATTRS.concat(['description', 'role'])
     };
 }
@@ -157,7 +159,7 @@ function coupleAttrs(attrsIn, attrsOut, whichAttrs, type) {
                     nestedAttrs, {}, whichAttrs, type
                 );
 
-                Plotly.Lib.nestedProperty(attrsOut, kk)
+                Lib.nestedProperty(attrsOut, kk)
                     .set(extendDeep({}, nestedReference));
             });
             return;
@@ -180,7 +182,7 @@ function coupleAttrs(attrsIn, attrsOut, whichAttrs, type) {
             return;
         }
 
-        attrsOut[k] = Plotly.Lib.isPlainObject(attrsIn[k]) ?
+        attrsOut[k] = Lib.isPlainObject(attrsIn[k]) ?
             extendDeepAll({}, attrsIn[k]) :
             attrsIn[k];
     });
@@ -214,7 +216,7 @@ function mergeValTypeAndRole(attrs) {
                 attrs[attrName + 'src'] = makeSrcAttr(attrName);
            }
         }
-        else if(Plotly.Lib.isPlainObject(attr)) {
+        else if(Lib.isPlainObject(attr)) {
             // all attrs container objects get role 'object'
             attr.role = 'object';
         }
@@ -229,9 +231,14 @@ function getModule(arg) {
     if('type' in arg) {
         return (arg.type === 'area') ?  // FIXME
             { attributes: polarAreaAttrs } :
-            Plotly.Plots.getModule({type: arg.type});
+            Plots.getModule({type: arg.type});
     }
-    else if('module' in arg) return Plotly[arg.module];
+
+    var subplotsRegistry = Plots.subplotsRegistry,
+        _module = arg.module;
+
+    if(subplotsRegistry[_module]) return subplotsRegistry[_module];
+    else if('module' in arg) return Plotly[_module];
 }
 
 function removeUnderscoreAttrs(attributes) {
@@ -244,7 +251,7 @@ function removeUnderscoreAttrs(attributes) {
 
 function getMeta(type) {
     if(type === 'area') return {};  // FIXME
-    return Plotly.Plots.modules[type].meta || {};
+    return Plots.modules[type].meta || {};
 }
 
 function assignPolarLayoutAttrs(layoutAttributes) {
@@ -261,9 +268,9 @@ function assignPolarLayoutAttrs(layoutAttributes) {
 function getSubplotRegistry(traceType) {
     if(traceType === 'area') return {};  // FIXME
 
-    var subplotsRegistry = Plotly.Plots.subplotsRegistry,
+    var subplotsRegistry = Plots.subplotsRegistry,
         subplotType = Object.keys(subplotsRegistry).filter(function(subplotType) {
-            return Plotly.Plots.traceIs({type: traceType}, subplotType);
+            return Plots.traceIs({type: traceType}, subplotType);
         })[0];
 
     if(subplotType === undefined) return {};
@@ -272,7 +279,7 @@ function getSubplotRegistry(traceType) {
 }
 
 function handleSubplotObjs(layoutAttributes) {
-    var subplotsRegistry = Plotly.Plots.subplotsRegistry;
+    var subplotsRegistry = Plots.subplotsRegistry;
 
     Object.keys(layoutAttributes).forEach(function(k) {
         Object.keys(subplotsRegistry).forEach(function(subplotType) {

src/plotly.js

@@ -33,14 +33,23 @@ exports.MathJaxConfig = require('./fonts/mathjax_config');
 exports.defaultConfig = require('./plot_api/plot_config');
 
 // plots
-exports.Plots = require('./plots/plots');
+var Plots = exports.Plots = require('./plots/plots');
+
+var Cartesian = require('./plots/cartesian');
+Plots.registerSubplot(Cartesian);
+
 exports.Axes = require('./plots/cartesian/axes');
 exports.Fx = require('./plots/cartesian/graph_interact');
-exports.Scene = require('./plots/gl3d/scene');
-exports.Gl3dLayout = require('./plots/gl3d/layout');
-exports.Geo = require('./plots/geo/geo');
-exports.GeoLayout = require('./plots/geo/layout');
-exports.Scene2D = require('./plots/gl2d/scene2d');
+
+var Geo = require('./plots/geo');
+Plots.registerSubplot(Geo);
+
+var Gl3d = require('./plots/gl3d');
+Plots.registerSubplot(Gl3d);
+
+var Gl2d = require('./plots/gl2d');
+Plots.registerSubplot(Gl2d);
+
 exports.micropolar = require('./plots/polar/micropolar');
 
 // components

src/plots/cartesian/axes.js

@@ -15,10 +15,6 @@ var isNumeric = require('fast-isnumeric');
 
 var axes = module.exports = {};
 
-axes.attributes = require('./attributes');
-
-Plotly.Plots.registerSubplot('cartesian', ['xaxis', 'yaxis'], ['x', 'y'], axes.attributes);
-
 axes.layoutAttributes = require('./layout_attributes');
 
 var xAxisMatch = /^xaxis[0-9]*$/,

src/plots/cartesian/index.js

@@ -0,0 +1,21 @@
+/**
+* Copyright 2012-2016, 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 Plotly = require('../../plotly');
+
+
+exports.name = 'cartesian';
+
+exports.attr = ['xaxis', 'yaxis'];
+
+exports.idRoot = ['x', 'y'];
+
+exports.attributes = require('./attributes');