diff --git a/superset/assets/visualizations/deckgl/factory.jsx b/superset/assets/visualizations/deckgl/factory.jsx
deleted file mode 100644
index fa6c372979..0000000000
--- a/superset/assets/visualizations/deckgl/factory.jsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-
-import DeckGLContainer from './DeckGLContainer';
-import layerGenerators from './layers';
-
-export default function deckglFactory(slice, payload, setControlValue) {
- const fd = slice.formData;
- const layer = layerGenerators[fd.viz_type](fd, payload, slice);
- const viewport = {
- ...fd.viewport,
- width: slice.width(),
- height: slice.height(),
- };
- ReactDOM.render(
- ,
- document.getElementById(slice.containerId),
- );
-}
diff --git a/superset/assets/visualizations/deckgl/layers/arc.jsx b/superset/assets/visualizations/deckgl/layers/arc.jsx
index 8e04e9af52..ebeff3cb89 100644
--- a/superset/assets/visualizations/deckgl/layers/arc.jsx
+++ b/superset/assets/visualizations/deckgl/layers/arc.jsx
@@ -1,9 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { ArcLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function arcLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const fc = fd.color_picker;
let data = payload.data.arcs.map(d => ({
@@ -24,3 +29,27 @@ export default function arcLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckArc(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckArc,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/geojson.jsx b/superset/assets/visualizations/deckgl/layers/geojson.jsx
index 7792d23c80..7f0936304e 100644
--- a/superset/assets/visualizations/deckgl/layers/geojson.jsx
+++ b/superset/assets/visualizations/deckgl/layers/geojson.jsx
@@ -1,5 +1,10 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { GeoJsonLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import { hexToRGB } from '../../../javascripts/modules/colors';
import sandboxedEval from '../../../javascripts/modules/sandbox';
@@ -53,7 +58,7 @@ const recurseGeoJson = (node, propOverrides, extraProps) => {
}
};
-export default function geoJsonLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const fc = fd.fill_color_picker;
const sc = fd.stroke_color_picker;
@@ -87,3 +92,27 @@ export default function geoJsonLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckGeoJson(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckGeoJson,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/grid.jsx b/superset/assets/visualizations/deckgl/layers/grid.jsx
index ed970d2976..1e7ff1d70b 100644
--- a/superset/assets/visualizations/deckgl/layers/grid.jsx
+++ b/superset/assets/visualizations/deckgl/layers/grid.jsx
@@ -1,9 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { GridLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function getLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const c = fd.color_picker;
let data = payload.data.features.map(d => ({
@@ -31,3 +36,27 @@ export default function getLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckGrid(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckGrid,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/hex.jsx b/superset/assets/visualizations/deckgl/layers/hex.jsx
index 86fb5349d5..7dc4d8b025 100644
--- a/superset/assets/visualizations/deckgl/layers/hex.jsx
+++ b/superset/assets/visualizations/deckgl/layers/hex.jsx
@@ -1,9 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { HexagonLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function getLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const c = fd.color_picker;
let data = payload.data.features.map(d => ({
@@ -31,3 +36,27 @@ export default function getLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckHex(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckHex,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/index.js b/superset/assets/visualizations/deckgl/layers/index.js
index 4e354e535e..d8d25d5b0e 100644
--- a/superset/assets/visualizations/deckgl/layers/index.js
+++ b/superset/assets/visualizations/deckgl/layers/index.js
@@ -1,12 +1,12 @@
/* eslint camelcase: 0 */
-import deck_grid from './grid';
-import deck_screengrid from './screengrid';
-import deck_path from './path';
-import deck_hex from './hex';
-import deck_scatter from './scatter';
-import deck_geojson from './geojson';
-import deck_arc from './arc';
-import deck_polygon from './polygon';
+import { getLayer as deck_grid } from './grid';
+import { getLayer as deck_screengrid } from './screengrid';
+import { getLayer as deck_path } from './path';
+import { getLayer as deck_hex } from './hex';
+import { getLayer as deck_scatter } from './scatter';
+import { getLayer as deck_geojson } from './geojson';
+import { getLayer as deck_arc } from './arc';
+import { getLayer as deck_polygon } from './polygon';
const layerGenerators = {
deck_grid,
diff --git a/superset/assets/visualizations/deckgl/layers/path.jsx b/superset/assets/visualizations/deckgl/layers/path.jsx
index df2c1b0c1a..a20c2bbdb0 100644
--- a/superset/assets/visualizations/deckgl/layers/path.jsx
+++ b/superset/assets/visualizations/deckgl/layers/path.jsx
@@ -1,9 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { PathLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function getLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const c = fd.color_picker;
const fixedColor = [c.r, c.g, c.b, 255 * c.a];
@@ -27,3 +32,27 @@ export default function getLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckPath(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckPath,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/polygon.jsx b/superset/assets/visualizations/deckgl/layers/polygon.jsx
index 886282707f..920fb6a89a 100644
--- a/superset/assets/visualizations/deckgl/layers/polygon.jsx
+++ b/superset/assets/visualizations/deckgl/layers/polygon.jsx
@@ -1,9 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { PolygonLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function polygonLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const fc = fd.fill_color_picker;
let data = payload.data.features.map(d => ({
@@ -26,3 +31,27 @@ export default function polygonLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckPolygon(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckPolygon,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/scatter.jsx b/superset/assets/visualizations/deckgl/layers/scatter.jsx
index 0f591a2123..ed1dd792af 100644
--- a/superset/assets/visualizations/deckgl/layers/scatter.jsx
+++ b/superset/assets/visualizations/deckgl/layers/scatter.jsx
@@ -1,11 +1,16 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { ScatterplotLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import { getColorFromScheme, hexToRGB } from '../../../javascripts/modules/colors';
import { unitToRadius } from '../../../javascripts/modules/geo';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function getLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const c = fd.color_picker || { r: 0, g: 0, b: 0, a: 1 };
const fixedColor = [c.r, c.g, c.b, 255 * c.a];
@@ -42,3 +47,27 @@ export default function getLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckScatter(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckScatter,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/deckgl/layers/screengrid.jsx b/superset/assets/visualizations/deckgl/layers/screengrid.jsx
index ca589cd8d5..7494c67d3d 100644
--- a/superset/assets/visualizations/deckgl/layers/screengrid.jsx
+++ b/superset/assets/visualizations/deckgl/layers/screengrid.jsx
@@ -1,9 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
import { ScreenGridLayer } from 'deck.gl';
+import DeckGLContainer from './../DeckGLContainer';
+
import * as common from './common';
import sandboxedEval from '../../../javascripts/modules/sandbox';
-export default function getLayer(formData, payload, slice) {
+function getLayer(formData, payload, slice) {
const fd = formData;
const c = fd.color_picker;
let data = payload.data.features.map(d => ({
@@ -31,3 +36,27 @@ export default function getLayer(formData, payload, slice) {
...common.commonLayerProps(fd, slice),
});
}
+
+function deckScreenGrid(slice, payload, setControlValue) {
+ const layer = getLayer(slice.formData, payload, slice);
+ const viewport = {
+ ...slice.formData.viewport,
+ width: slice.width(),
+ height: slice.height(),
+ };
+ ReactDOM.render(
+ ,
+ document.getElementById(slice.containerId),
+ );
+}
+
+module.exports = {
+ default: deckScreenGrid,
+ getLayer,
+};
diff --git a/superset/assets/visualizations/main.js b/superset/assets/visualizations/main.js
index 93c12e8617..40b6592d90 100644
--- a/superset/assets/visualizations/main.js
+++ b/superset/assets/visualizations/main.js
@@ -1,5 +1,4 @@
/* eslint-disable global-require */
-import deckglFactory from './deckgl/factory';
// You ***should*** use these to reference viz_types in code
export const VIZ_TYPES = {
@@ -89,14 +88,14 @@ const vizMap = {
[VIZ_TYPES.event_flow]: require('./EventFlow.jsx'),
[VIZ_TYPES.paired_ttest]: require('./paired_ttest.jsx'),
[VIZ_TYPES.partition]: require('./partition.js'),
- [VIZ_TYPES.deck_scatter]: deckglFactory,
- [VIZ_TYPES.deck_screengrid]: deckglFactory,
- [VIZ_TYPES.deck_grid]: deckglFactory,
- [VIZ_TYPES.deck_hex]: deckglFactory,
- [VIZ_TYPES.deck_path]: deckglFactory,
- [VIZ_TYPES.deck_geojson]: deckglFactory,
- [VIZ_TYPES.deck_arc]: deckglFactory,
- [VIZ_TYPES.deck_polygon]: deckglFactory,
+ [VIZ_TYPES.deck_scatter]: require('./deckgl/layers/scatter.jsx').default,
+ [VIZ_TYPES.deck_screengrid]: require('./deckgl/layers/screengrid.jsx').default,
+ [VIZ_TYPES.deck_grid]: require('./deckgl/layers/grid.jsx').default,
+ [VIZ_TYPES.deck_hex]: require('./deckgl/layers/hex.jsx').default,
+ [VIZ_TYPES.deck_path]: require('./deckgl/layers/path.jsx').default,
+ [VIZ_TYPES.deck_geojson]: require('./deckgl/layers/geojson.jsx').default,
+ [VIZ_TYPES.deck_arc]: require('./deckgl/layers/arc.jsx').default,
+ [VIZ_TYPES.deck_polygon]: require('./deckgl/layers/polygon.jsx').default,
[VIZ_TYPES.deck_multi]: require('./deckgl/multi.jsx'),
};
export default vizMap;