superset-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From ccwilli...@apache.org
Subject [incubator-superset] branch master updated: [Ready] Define ChartProps data structure (#6125)
Date Thu, 18 Oct 2018 22:44:27 GMT
This is an automated email from the ASF dual-hosted git repository.

ccwilliams pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git


The following commit(s) were added to refs/heads/master by this push:
     new d662e36  [Ready] Define ChartProps data structure (#6125)
d662e36 is described below

commit d662e3644201086dca39b0808545dc571b16380b
Author: Krist Wongsuphasawat <krist.wongz@gmail.com>
AuthorDate: Thu Oct 18 15:44:21 2018 -0700

    [Ready] Define ChartProps data structure (#6125)
    
    * rename basicChartInput to chartProps
    
    * replace BasicChartInput with ChartProps class
    
    * Add transformProps to deck.gl plugins
    
    * Add space
    
    * delete BasicChartInput
    
    * add width and height as part of ChartProps and update transformProps
    
    * remove width and height
    
    * remove adaptors from deck.gl components
    
    * remove deck.gl creataAdaptor
---
 superset/assets/src/utils/createAdaptor.jsx        | 29 +++++++++++++++-----
 .../src/visualizations/BigNumber/transformProps.js |  6 +++--
 .../src/visualizations/Calendar/transformProps.js  |  5 ++--
 .../src/visualizations/Chord/transformProps.js     |  6 +++--
 .../visualizations/CountryMap/transformProps.js    |  6 +++--
 .../src/visualizations/EventFlow/transformProps.js |  4 +--
 .../src/visualizations/FilterBox/transformProps.js |  4 +--
 .../visualizations/ForceDirected/transformProps.js |  6 +++--
 .../src/visualizations/Heatmap/transformProps.js   |  6 +++--
 .../src/visualizations/Histogram/transformProps.js |  6 +++--
 .../src/visualizations/Horizon/transformProps.js   |  5 ++--
 .../src/visualizations/MapBox/transformProps.js    |  6 +++--
 .../visualizations/PairedTTest/transformProps.js   |  4 +--
 .../ParallelCoordinates/transformProps.js          |  6 +++--
 .../src/visualizations/Partition/transformProps.js |  6 +++--
 .../visualizations/PivotTable/transformProps.js    |  5 ++--
 .../src/visualizations/Rose/transformProps.js      |  6 +++--
 .../src/visualizations/Sankey/transformProps.js    |  6 +++--
 .../src/visualizations/Sunburst/transformProps.js  |  6 +++--
 .../src/visualizations/Table/transformProps.js     |  6 +++--
 .../src/visualizations/TimeTable/transformProps.js |  5 ++--
 .../src/visualizations/Treemap/transformProps.js   |  6 +++--
 .../src/visualizations/WorldMap/transformProps.js  |  5 ++--
 .../src/visualizations/core/models/ChartProps.js   | 31 ++++++++++++++++++++++
 .../src/visualizations/deckgl/Multi/Multi.jsx      |  3 +--
 .../deckgl/Multi/MultiChartPlugin.js               |  2 ++
 .../src/visualizations/deckgl/createAdaptor.jsx    | 30 ---------------------
 .../src/visualizations/deckgl/layers/Arc/Arc.jsx   |  3 +--
 .../deckgl/layers/Arc/ArcChartPlugin.js            |  2 ++
 .../deckgl/layers/Geojson/Geojson.jsx              |  3 +--
 .../deckgl/layers/Geojson/GeojsonChartPlugin.js    |  2 ++
 .../src/visualizations/deckgl/layers/Grid/Grid.jsx |  3 +--
 .../deckgl/layers/Grid/GridChartPlugin.js          |  2 ++
 .../src/visualizations/deckgl/layers/Hex/Hex.jsx   |  3 +--
 .../deckgl/layers/Hex/HexChartPlugin.js            |  2 ++
 .../src/visualizations/deckgl/layers/Path/Path.jsx |  3 +--
 .../deckgl/layers/Path/PathChartPlugin.js          |  2 ++
 .../deckgl/layers/Polygon/Polygon.jsx              |  3 +--
 .../deckgl/layers/Polygon/PolygonChartPlugin.js    |  2 ++
 .../deckgl/layers/Scatter/Scatter.jsx              |  3 +--
 .../deckgl/layers/Scatter/ScatterChartPlugin.js    |  2 ++
 .../deckgl/layers/Screengrid/Screengrid.jsx        |  3 +--
 .../layers/Screengrid/ScreengridChartPlugin.js     |  2 ++
 .../src/visualizations/deckgl/transformProps.js    | 24 +++++++++++++++++
 superset/assets/src/visualizations/index.js        | 26 +++++++++++-------
 .../src/visualizations/models/BasicChartInput.js   | 19 -------------
 .../src/visualizations/nvd3/transformProps.js      |  8 ++++--
 .../src/visualizations/wordcloud/transformProps.js |  6 +++--
 48 files changed, 207 insertions(+), 132 deletions(-)

diff --git a/superset/assets/src/utils/createAdaptor.jsx b/superset/assets/src/utils/createAdaptor.jsx
index 0de1d25..c107e0d 100644
--- a/superset/assets/src/utils/createAdaptor.jsx
+++ b/superset/assets/src/utils/createAdaptor.jsx
@@ -1,18 +1,33 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import BasicChartInput from '../visualizations/models/BasicChartInput';
+import ChartProps from '../visualizations/core/models/ChartProps';
 
 const IDENTITY = x => x;
 
 export default function createAdaptor(Component, transformProps = IDENTITY) {
   return function adaptor(slice, payload, setControlValue) {
-    const basicChartInput = new BasicChartInput(slice, payload, setControlValue);
+    const chartProps = new ChartProps({
+      width: slice.width(),
+      height: slice.height(),
+      annotationData: slice.annotationData,
+      datasource: slice.datasource,
+      filters: slice.getFilters(),
+      formData: slice.formData,
+      onAddFilter(...args) {
+        slice.addFilter(...args);
+      },
+      onError(...args) {
+        slice.error(...args);
+      },
+      payload,
+      setControlValue,
+      setTooltip(...args) {
+        slice.setTooltip(...args);
+      },
+    });
+
     ReactDOM.render(
-      <Component
-        width={slice.width()}
-        height={slice.height()}
-        {...transformProps(basicChartInput)}
-      />,
+      <Component {...transformProps(chartProps)} />,
       document.querySelector(slice.selector),
     );
   };
diff --git a/superset/assets/src/visualizations/BigNumber/transformProps.js b/superset/assets/src/visualizations/BigNumber/transformProps.js
index 7b06874..41a9df5 100644
--- a/superset/assets/src/visualizations/BigNumber/transformProps.js
+++ b/superset/assets/src/visualizations/BigNumber/transformProps.js
@@ -5,8 +5,8 @@ import { renderTooltipFactory } from './BigNumber';
 
 const TIME_COLUMN = '__timestamp';
 
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     colorPicker,
     compareLag: compareLagInput,
@@ -65,6 +65,8 @@ export default function transformProps(basicChartInput) {
   const formatValue = d3FormatPreset(yAxisFormat);
 
   return {
+    width,
+    height,
     bigNumber,
     className,
     formatBigNumber: formatValue,
diff --git a/superset/assets/src/visualizations/Calendar/transformProps.js b/superset/assets/src/visualizations/Calendar/transformProps.js
index e97e166..77cd830 100644
--- a/superset/assets/src/visualizations/Calendar/transformProps.js
+++ b/superset/assets/src/visualizations/Calendar/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload, datasource } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { height, formData, payload, datasource } = chartProps;
   const {
     cellPadding,
     cellRadius,
@@ -16,6 +16,7 @@ export default function transformProps(basicChartInput) {
   const { verboseMap } = datasource;
 
   return {
+    height,
     data: payload.data,
     cellPadding,
     cellRadius,
diff --git a/superset/assets/src/visualizations/Chord/transformProps.js b/superset/assets/src/visualizations/Chord/transformProps.js
index f52a1dc..7ccbfaa 100644
--- a/superset/assets/src/visualizations/Chord/transformProps.js
+++ b/superset/assets/src/visualizations/Chord/transformProps.js
@@ -1,8 +1,10 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const { yAxisFormat, colorScheme } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     numberFormat: yAxisFormat,
     colorScheme,
diff --git a/superset/assets/src/visualizations/CountryMap/transformProps.js b/superset/assets/src/visualizations/CountryMap/transformProps.js
index 4026335..6c59eda 100644
--- a/superset/assets/src/visualizations/CountryMap/transformProps.js
+++ b/superset/assets/src/visualizations/CountryMap/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     linearColorScheme,
     numberFormat,
@@ -7,6 +7,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     country: selectCountry,
     linearColorScheme,
diff --git a/superset/assets/src/visualizations/EventFlow/transformProps.js b/superset/assets/src/visualizations/EventFlow/transformProps.js
index b517693..5e2866d 100644
--- a/superset/assets/src/visualizations/EventFlow/transformProps.js
+++ b/superset/assets/src/visualizations/EventFlow/transformProps.js
@@ -5,8 +5,8 @@ import {
   ENTITY_ID,
 } from '@data-ui/event-flow';
 
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { formData, payload } = chartProps;
   const {
     allColumnsX,
     entity,
diff --git a/superset/assets/src/visualizations/FilterBox/transformProps.js b/superset/assets/src/visualizations/FilterBox/transformProps.js
index e5077f8..f846c40 100644
--- a/superset/assets/src/visualizations/FilterBox/transformProps.js
+++ b/superset/assets/src/visualizations/FilterBox/transformProps.js
@@ -1,4 +1,4 @@
-export default function transformProps(basicChartInput) {
+export default function transformProps(chartProps) {
   const {
     datasource,
     filters,
@@ -6,7 +6,7 @@ export default function transformProps(basicChartInput) {
     onAddFilter,
     payload,
     rawDatasource,
-  } = basicChartInput;
+  } = chartProps;
   const {
     dateFilter,
     groupby,
diff --git a/superset/assets/src/visualizations/ForceDirected/transformProps.js b/superset/assets/src/visualizations/ForceDirected/transformProps.js
index 115f353..9c526e4 100644
--- a/superset/assets/src/visualizations/ForceDirected/transformProps.js
+++ b/superset/assets/src/visualizations/ForceDirected/transformProps.js
@@ -1,8 +1,10 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const { charge, linkLength } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     charge,
     linkLength,
diff --git a/superset/assets/src/visualizations/Heatmap/transformProps.js b/superset/assets/src/visualizations/Heatmap/transformProps.js
index 9c4ad10..39d327a 100644
--- a/superset/assets/src/visualizations/Heatmap/transformProps.js
+++ b/superset/assets/src/visualizations/Heatmap/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     bottomMargin,
     canvasImageRendering,
@@ -21,6 +21,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     bottomMargin,
     canvasImageRendering,
diff --git a/superset/assets/src/visualizations/Histogram/transformProps.js b/superset/assets/src/visualizations/Histogram/transformProps.js
index 0c522a1..6786d96 100644
--- a/superset/assets/src/visualizations/Histogram/transformProps.js
+++ b/superset/assets/src/visualizations/Histogram/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     colorScheme,
     linkLength,
@@ -10,6 +10,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     binCount: parseInt(linkLength, 10),
     colorScheme,
diff --git a/superset/assets/src/visualizations/Horizon/transformProps.js b/superset/assets/src/visualizations/Horizon/transformProps.js
index b5838c2..04d9c0b 100644
--- a/superset/assets/src/visualizations/Horizon/transformProps.js
+++ b/superset/assets/src/visualizations/Horizon/transformProps.js
@@ -1,11 +1,12 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, formData, payload } = chartProps;
   const {
     horizonColorScale,
     seriesHeight,
   } = formData;
 
   return {
+    width,
     data: payload.data,
     seriesHeight: parseInt(seriesHeight, 10),
     colorScale: horizonColorScale,
diff --git a/superset/assets/src/visualizations/MapBox/transformProps.js b/superset/assets/src/visualizations/MapBox/transformProps.js
index 4180eef..4f9d70c 100644
--- a/superset/assets/src/visualizations/MapBox/transformProps.js
+++ b/superset/assets/src/visualizations/MapBox/transformProps.js
@@ -1,8 +1,8 @@
 import supercluster from 'supercluster';
 import { DEFAULT_POINT_RADIUS, DEFAULT_MAX_ZOOM } from './MapBox';
 
-export default function transformProps(basicChartInput) {
-  const { formData, onError, payload, setControlValue } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, onError, payload, setControlValue } = chartProps;
   const {
     bounds,
     geoJSON,
@@ -59,6 +59,8 @@ export default function transformProps(basicChartInput) {
   clusterer.load(geoJSON.features);
 
   return {
+    width,
+    height,
     aggregatorName: pandasAggfunc,
     bounds,
     clusterer,
diff --git a/superset/assets/src/visualizations/PairedTTest/transformProps.js b/superset/assets/src/visualizations/PairedTTest/transformProps.js
index 84abe5b..45df872 100644
--- a/superset/assets/src/visualizations/PairedTTest/transformProps.js
+++ b/superset/assets/src/visualizations/PairedTTest/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { formData, payload } = chartProps;
   const {
     groupby,
     liftvaluePrecision,
diff --git a/superset/assets/src/visualizations/ParallelCoordinates/transformProps.js b/superset/assets/src/visualizations/ParallelCoordinates/transformProps.js
index 6f5c7c4..edc1159 100644
--- a/superset/assets/src/visualizations/ParallelCoordinates/transformProps.js
+++ b/superset/assets/src/visualizations/ParallelCoordinates/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     includeSeries,
     linearColorScheme,
@@ -10,6 +10,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     includeSeries,
     linearColorScheme,
diff --git a/superset/assets/src/visualizations/Partition/transformProps.js b/superset/assets/src/visualizations/Partition/transformProps.js
index 04ed059..e19a7ff 100644
--- a/superset/assets/src/visualizations/Partition/transformProps.js
+++ b/superset/assets/src/visualizations/Partition/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { datasource, formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, datasource, formData, payload } = chartProps;
   const {
     colorScheme,
     dateTimeFormat,
@@ -16,6 +16,8 @@ export default function transformProps(basicChartInput) {
   const { verboseMap } = datasource;
 
   return {
+    width,
+    height,
     data: payload.data,
     colorScheme,
     dateTimeFormat,
diff --git a/superset/assets/src/visualizations/PivotTable/transformProps.js b/superset/assets/src/visualizations/PivotTable/transformProps.js
index 880cd28..85196f7 100644
--- a/superset/assets/src/visualizations/PivotTable/transformProps.js
+++ b/superset/assets/src/visualizations/PivotTable/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { datasource, formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { height, datasource, formData, payload } = chartProps;
   const {
     groupby,
     numberFormat,
@@ -10,6 +10,7 @@ export default function transformProps(basicChartInput) {
   } = datasource;
 
   return {
+    height,
     data: payload.data,
     columnFormats,
     numGroups: groupby.length,
diff --git a/superset/assets/src/visualizations/Rose/transformProps.js b/superset/assets/src/visualizations/Rose/transformProps.js
index afc09ea..8af9d68 100644
--- a/superset/assets/src/visualizations/Rose/transformProps.js
+++ b/superset/assets/src/visualizations/Rose/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     colorScheme,
     dateTimeFormat,
@@ -9,6 +9,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     colorScheme,
     dateTimeFormat,
diff --git a/superset/assets/src/visualizations/Sankey/transformProps.js b/superset/assets/src/visualizations/Sankey/transformProps.js
index 4d354b2..efc9da5 100644
--- a/superset/assets/src/visualizations/Sankey/transformProps.js
+++ b/superset/assets/src/visualizations/Sankey/transformProps.js
@@ -1,8 +1,10 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const { colorScheme } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     colorScheme,
   };
diff --git a/superset/assets/src/visualizations/Sunburst/transformProps.js b/superset/assets/src/visualizations/Sunburst/transformProps.js
index 465bd7c..fa6e25d 100644
--- a/superset/assets/src/visualizations/Sunburst/transformProps.js
+++ b/superset/assets/src/visualizations/Sunburst/transformProps.js
@@ -1,8 +1,10 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const { colorScheme, metric, secondaryMetric } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     colorScheme,
     metrics: [metric, secondaryMetric],
diff --git a/superset/assets/src/visualizations/Table/transformProps.js b/superset/assets/src/visualizations/Table/transformProps.js
index 381931b..ab93a71 100644
--- a/superset/assets/src/visualizations/Table/transformProps.js
+++ b/superset/assets/src/visualizations/Table/transformProps.js
@@ -1,11 +1,12 @@
-export default function transformProps(basicChartInput) {
+export default function transformProps(chartProps) {
   const {
+    height,
     datasource,
     filters,
     formData,
     onAddFilter,
     payload,
-  } = basicChartInput;
+  } = chartProps;
   const {
     alignPn,
     colorPn,
@@ -40,6 +41,7 @@ export default function transformProps(basicChartInput) {
   });
 
   return {
+    height,
     data: records,
     alignPositiveNegative: alignPn,
     colorPositiveNegative: colorPn,
diff --git a/superset/assets/src/visualizations/TimeTable/transformProps.js b/superset/assets/src/visualizations/TimeTable/transformProps.js
index 11a1a1a..d880fae 100644
--- a/superset/assets/src/visualizations/TimeTable/transformProps.js
+++ b/superset/assets/src/visualizations/TimeTable/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { datasource, formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { height, datasource, formData, payload } = chartProps;
   const {
     columnCollection,
     groupby,
@@ -40,6 +40,7 @@ export default function transformProps(basicChartInput) {
   });
 
   return {
+    height,
     data: records,
     columnConfigs: columnCollection,
     rows,
diff --git a/superset/assets/src/visualizations/Treemap/transformProps.js b/superset/assets/src/visualizations/Treemap/transformProps.js
index c0c3c03..df5f29a 100644
--- a/superset/assets/src/visualizations/Treemap/transformProps.js
+++ b/superset/assets/src/visualizations/Treemap/transformProps.js
@@ -1,5 +1,5 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     colorScheme,
     numberFormat,
@@ -7,6 +7,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: payload.data,
     colorScheme,
     numberFormat,
diff --git a/superset/assets/src/visualizations/WorldMap/transformProps.js b/superset/assets/src/visualizations/WorldMap/transformProps.js
index 4e56b03..011a674 100644
--- a/superset/assets/src/visualizations/WorldMap/transformProps.js
+++ b/superset/assets/src/visualizations/WorldMap/transformProps.js
@@ -1,8 +1,9 @@
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { height, formData, payload } = chartProps;
   const { maxBubbleSize, showBubbles } = formData;
 
   return {
+    height,
     data: payload.data,
     maxBubbleSize: parseInt(maxBubbleSize, 10),
     showBubbles,
diff --git a/superset/assets/src/visualizations/core/models/ChartProps.js b/superset/assets/src/visualizations/core/models/ChartProps.js
new file mode 100644
index 0000000..7f10cec
--- /dev/null
+++ b/superset/assets/src/visualizations/core/models/ChartProps.js
@@ -0,0 +1,31 @@
+import convertKeysToCamelCase from '../../../utils/convertKeysToCamelCase';
+
+export default class ChartProps {
+  constructor({
+    width,
+    height,
+    annotationData,
+    datasource,
+    filters,
+    formData,
+    onAddFilter,
+    onError,
+    payload,
+    setControlValue,
+    setTooltip,
+  }) {
+    this.width = width;
+    this.height = height;
+    this.annotationData = annotationData;
+    this.datasource = convertKeysToCamelCase(datasource);
+    this.rawDatasource = datasource;
+    this.filters = filters;
+    this.formData = convertKeysToCamelCase(formData);
+    this.rawFormData = formData;
+    this.onAddFilter = onAddFilter;
+    this.onError = onError;
+    this.payload = payload;
+    this.setControlValue = setControlValue;
+    this.setTooltip = setTooltip;
+  }
+}
diff --git a/superset/assets/src/visualizations/deckgl/Multi/Multi.jsx b/superset/assets/src/visualizations/deckgl/Multi/Multi.jsx
index 99bd1a8..64c1ec6 100644
--- a/superset/assets/src/visualizations/deckgl/Multi/Multi.jsx
+++ b/superset/assets/src/visualizations/deckgl/Multi/Multi.jsx
@@ -4,7 +4,6 @@ import $ from 'jquery';
 import DeckGLContainer from '../DeckGLContainer';
 import { getExploreLongUrl } from '../../../explore/exploreUtils';
 import layerGenerators from '../layers';
-import createAdaptor from '../createAdaptor';
 
 const propTypes = {
   formData: PropTypes.object.isRequired,
@@ -84,4 +83,4 @@ class DeckMulti extends React.PureComponent {
 
 DeckMulti.propTypes = propTypes;
 
-export default createAdaptor(DeckMulti);
+export default DeckMulti;
diff --git a/superset/assets/src/visualizations/deckgl/Multi/MultiChartPlugin.js b/superset/assets/src/visualizations/deckgl/Multi/MultiChartPlugin.js
index fd869f8..95f2bd5 100644
--- a/superset/assets/src/visualizations/deckgl/Multi/MultiChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/Multi/MultiChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../core/models/ChartPlugin';
 import ChartMetadata from '../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Multiple Layers',
@@ -14,6 +15,7 @@ export default class MultiChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Multi.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/createAdaptor.jsx b/superset/assets/src/visualizations/deckgl/createAdaptor.jsx
deleted file mode 100644
index 080bf68..0000000
--- a/superset/assets/src/visualizations/deckgl/createAdaptor.jsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-
-const IDENTITY = x => x;
-
-class DeckGlChartInput {
-  constructor(slice, payload, setControlValue) {
-    this.formData = slice.formData;
-    this.payload = payload;
-    this.setControlValue = setControlValue;
-    this.viewport = {
-      ...this.formData.viewport,
-      width: slice.width(),
-      height: slice.height(),
-    };
-
-    this.onAddFilter = ((...args) => { slice.addFilter(...args); });
-    this.setTooltip = ((...args) => { slice.setTooltip(...args); });
-  }
-}
-
-export default function createAdaptor(Component, transformProps = IDENTITY) {
-  return function adaptor(slice, payload, setControlValue) {
-    const chartInput = new DeckGlChartInput(slice, payload, setControlValue);
-    ReactDOM.render(
-      <Component {...transformProps(chartInput)} />,
-      document.querySelector(slice.selector),
-    );
-  };
-}
diff --git a/superset/assets/src/visualizations/deckgl/layers/Arc/Arc.jsx b/superset/assets/src/visualizations/deckgl/layers/Arc/Arc.jsx
index d74c21d..a80385d 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Arc/Arc.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Arc/Arc.jsx
@@ -1,6 +1,5 @@
 import { ArcLayer } from 'deck.gl';
 import { commonLayerProps } from '../common';
-import createAdaptor from '../../createAdaptor';
 import { createCategoricalDeckGLComponent } from '../../factory';
 
 function getPoints(data) {
@@ -26,4 +25,4 @@ export function getLayer(fd, payload, onAddFilter, setTooltip) {
   });
 }
 
-export default createAdaptor(createCategoricalDeckGLComponent(getLayer, getPoints));
+export default createCategoricalDeckGLComponent(getLayer, getPoints);
diff --git a/superset/assets/src/visualizations/deckgl/layers/Arc/ArcChartPlugin.js b/superset/assets/src/visualizations/deckgl/layers/Arc/ArcChartPlugin.js
index 62606af..d6cb9b3 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Arc/ArcChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Arc/ArcChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Arc',
@@ -14,6 +15,7 @@ export default class ArcChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Arc.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Geojson/Geojson.jsx b/superset/assets/src/visualizations/deckgl/layers/Geojson/Geojson.jsx
index f9f0b6e..469b724 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Geojson/Geojson.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Geojson/Geojson.jsx
@@ -7,7 +7,6 @@ import DeckGLContainer from '../../DeckGLContainer';
 import { hexToRGB } from '../../../../modules/colors';
 import sandboxedEval from '../../../../modules/sandbox';
 import { commonLayerProps } from '../common';
-import createAdaptor from '../../createAdaptor';
 
 const propertyMap = {
   fillColor: 'fillColor',
@@ -137,4 +136,4 @@ function deckGeoJson(props) {
 deckGeoJson.propTypes = propTypes;
 deckGeoJson.defaultProps = defaultProps;
 
-export default createAdaptor(deckGeoJson);
+export default deckGeoJson;
diff --git a/superset/assets/src/visualizations/deckgl/layers/Geojson/GeojsonChartPlugin.js
b/superset/assets/src/visualizations/deckgl/layers/Geojson/GeojsonChartPlugin.js
index 5f1ccab..15895de 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Geojson/GeojsonChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Geojson/GeojsonChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Geojson',
@@ -14,6 +15,7 @@ export default class GeojsonChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Geojson.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Grid/Grid.jsx b/superset/assets/src/visualizations/deckgl/layers/Grid/Grid.jsx
index 63dd12c..5f32849 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Grid/Grid.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Grid/Grid.jsx
@@ -1,7 +1,6 @@
 import { GridLayer } from 'deck.gl';
 import { commonLayerProps } from '../common';
 import sandboxedEval from '../../../../modules/sandbox';
-import createAdaptor from '../../createAdaptor';
 import { createDeckGLComponent } from '../../factory';
 
 export function getLayer(formData, payload, onAddFilter, setTooltip) {
@@ -37,4 +36,4 @@ function getPoints(data) {
   return data.map(d => d.position);
 }
 
-export default createAdaptor(createDeckGLComponent(getLayer, getPoints));
+export default createDeckGLComponent(getLayer, getPoints);
diff --git a/superset/assets/src/visualizations/deckgl/layers/Grid/GridChartPlugin.js b/superset/assets/src/visualizations/deckgl/layers/Grid/GridChartPlugin.js
index 71ca50e..36ae452 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Grid/GridChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Grid/GridChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Grid',
@@ -14,6 +15,7 @@ export default class GridChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Grid.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Hex/Hex.jsx b/superset/assets/src/visualizations/deckgl/layers/Hex/Hex.jsx
index 6919819..8b6f098 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Hex/Hex.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Hex/Hex.jsx
@@ -1,7 +1,6 @@
 import { HexagonLayer } from 'deck.gl';
 import { commonLayerProps } from '../common';
 import sandboxedEval from '../../../../modules/sandbox';
-import createAdaptor from '../../createAdaptor';
 import { createDeckGLComponent } from '../../factory';
 
 export function getLayer(formData, payload, onAddFilter, setTooltip) {
@@ -37,4 +36,4 @@ function getPoints(data) {
   return data.map(d => d.position);
 }
 
-export default createAdaptor(createDeckGLComponent(getLayer, getPoints));
+export default createDeckGLComponent(getLayer, getPoints);
diff --git a/superset/assets/src/visualizations/deckgl/layers/Hex/HexChartPlugin.js b/superset/assets/src/visualizations/deckgl/layers/Hex/HexChartPlugin.js
index a84a94b..9550107 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Hex/HexChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Hex/HexChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl 3D Hexagon',
@@ -14,6 +15,7 @@ export default class HexChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Hex.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Path/Path.jsx b/superset/assets/src/visualizations/deckgl/layers/Path/Path.jsx
index 052868d..8a6099e 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Path/Path.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Path/Path.jsx
@@ -1,7 +1,6 @@
 import { PathLayer } from 'deck.gl';
 import { commonLayerProps } from '../common';
 import sandboxedEval from '../../../../modules/sandbox';
-import createAdaptor from '../../createAdaptor';
 import { createDeckGLComponent } from '../../factory';
 
 export function getLayer(formData, payload, onAddFilter, setTooltip) {
@@ -37,4 +36,4 @@ function getPoints(data) {
   return points;
 }
 
-export default createAdaptor(createDeckGLComponent(getLayer, getPoints));
+export default createDeckGLComponent(getLayer, getPoints);
diff --git a/superset/assets/src/visualizations/deckgl/layers/Path/PathChartPlugin.js b/superset/assets/src/visualizations/deckgl/layers/Path/PathChartPlugin.js
index bf04448..422a06d 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Path/PathChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Path/PathChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Path',
@@ -14,6 +15,7 @@ export default class PathChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Path.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Polygon/Polygon.jsx b/superset/assets/src/visualizations/deckgl/layers/Polygon/Polygon.jsx
index 82164c6..922e4a0 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Polygon/Polygon.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Polygon/Polygon.jsx
@@ -4,7 +4,6 @@ import { flatten } from 'lodash';
 import { colorScalerFactory } from '../../../../modules/colors';
 import { commonLayerProps } from '../common';
 import sandboxedEval from '../../../../modules/sandbox';
-import createAdaptor from '../../createAdaptor';
 import { createDeckGLComponent } from '../../factory';
 
 function getPoints(features) {
@@ -49,4 +48,4 @@ export function getLayer(formData, payload, onAddFilter, setTooltip) {
   });
 }
 
-export default createAdaptor(createDeckGLComponent(getLayer, getPoints));
+export default createDeckGLComponent(getLayer, getPoints);
diff --git a/superset/assets/src/visualizations/deckgl/layers/Polygon/PolygonChartPlugin.js
b/superset/assets/src/visualizations/deckgl/layers/Polygon/PolygonChartPlugin.js
index f6f0395..e8e0d19 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Polygon/PolygonChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Polygon/PolygonChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Polygon',
@@ -14,6 +15,7 @@ export default class PolygonChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Polygon.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Scatter/Scatter.jsx b/superset/assets/src/visualizations/deckgl/layers/Scatter/Scatter.jsx
index f20a723..e522e73 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Scatter/Scatter.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Scatter/Scatter.jsx
@@ -1,6 +1,5 @@
 import { ScatterplotLayer } from 'deck.gl';
 import { commonLayerProps } from '../common';
-import createAdaptor from '../../createAdaptor';
 import { createCategoricalDeckGLComponent } from '../../factory';
 import { unitToRadius } from '../../../../modules/geo';
 
@@ -33,4 +32,4 @@ export function getLayer(fd, payload, slice) {
   });
 }
 
-export default createAdaptor(createCategoricalDeckGLComponent(getLayer, getPoints));
+export default createCategoricalDeckGLComponent(getLayer, getPoints);
diff --git a/superset/assets/src/visualizations/deckgl/layers/Scatter/ScatterChartPlugin.js
b/superset/assets/src/visualizations/deckgl/layers/Scatter/ScatterChartPlugin.js
index a0919b5..d381e34 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Scatter/ScatterChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Scatter/ScatterChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Scatterplot',
@@ -14,6 +15,7 @@ export default class ScatterChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Scatter.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/layers/Screengrid/Screengrid.jsx b/superset/assets/src/visualizations/deckgl/layers/Screengrid/Screengrid.jsx
index 7e7767a..4611deb 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Screengrid/Screengrid.jsx
+++ b/superset/assets/src/visualizations/deckgl/layers/Screengrid/Screengrid.jsx
@@ -7,7 +7,6 @@ import AnimatableDeckGLContainer from '../../AnimatableDeckGLContainer';
 import { getPlaySliderParams } from '../../../../modules/time';
 import sandboxedEval from '../../../../modules/sandbox';
 import { commonLayerProps, fitViewport } from '../common';
-import createAdaptor from '../../createAdaptor';
 
 function getPoints(data) {
   return data.map(d => d.position);
@@ -135,4 +134,4 @@ class DeckGLScreenGrid extends React.PureComponent {
 DeckGLScreenGrid.propTypes = propTypes;
 DeckGLScreenGrid.defaultProps = defaultProps;
 
-export default createAdaptor(DeckGLScreenGrid);
+export default DeckGLScreenGrid;
diff --git a/superset/assets/src/visualizations/deckgl/layers/Screengrid/ScreengridChartPlugin.js
b/superset/assets/src/visualizations/deckgl/layers/Screengrid/ScreengridChartPlugin.js
index c237395..193fd7f 100644
--- a/superset/assets/src/visualizations/deckgl/layers/Screengrid/ScreengridChartPlugin.js
+++ b/superset/assets/src/visualizations/deckgl/layers/Screengrid/ScreengridChartPlugin.js
@@ -1,6 +1,7 @@
 import ChartPlugin from '../../../core/models/ChartPlugin';
 import ChartMetadata from '../../../core/models/ChartMetadata';
 import thumbnail from './images/thumbnail.png';
+import transformProps from '../../transformProps';
 
 const metadata = new ChartMetadata({
   name: 'deck.gl Screen Grid',
@@ -14,6 +15,7 @@ export default class ScreengridChartPlugin extends ChartPlugin {
     super({
       metadata,
       loadChart: () => import('./Screengrid.jsx'),
+      transformProps,
     });
   }
 }
diff --git a/superset/assets/src/visualizations/deckgl/transformProps.js b/superset/assets/src/visualizations/deckgl/transformProps.js
new file mode 100644
index 0000000..fdff97b
--- /dev/null
+++ b/superset/assets/src/visualizations/deckgl/transformProps.js
@@ -0,0 +1,24 @@
+export default function transformProps(chartProps) {
+  const {
+    width,
+    height,
+    rawFormData,
+    payload,
+    setControlValue,
+    onAddFilter,
+    setTooltip,
+  } = chartProps;
+
+  return {
+    formData: rawFormData,
+    payload,
+    setControlValue,
+    viewport: {
+      ...rawFormData.viewport,
+      width,
+      height,
+    },
+    onAddFilter,
+    setTooltip,
+  };
+}
diff --git a/superset/assets/src/visualizations/index.js b/superset/assets/src/visualizations/index.js
index 2e4610e..52945be 100644
--- a/superset/assets/src/visualizations/index.js
+++ b/superset/assets/src/visualizations/index.js
@@ -1,3 +1,6 @@
+import createAdaptor from '../utils/createAdaptor';
+import transformProps from './deckgl/transformProps';
+
 /* eslint-disable global-require */
 
 // You ***should*** use these to reference viz_types in code
@@ -55,10 +58,13 @@ export const VIZ_TYPES = {
 const loadVis = promise =>
   promise.then((module) => {
     const defaultExport = module.default || module;
-
     // deckgl visualizations don't use esModules, fix it?
     return defaultExport.default || defaultExport;
   });
+
+const loadDeckGLVis = promise =>
+  loadVis(promise).then(module => createAdaptor(module, transformProps));
+
 const loadNvd3 = () => loadVis(import(/* webpackChunkName: "nvd3_vis" */ './nvd3/adaptor.jsx'));
 
 const vizMap = {
@@ -117,25 +123,25 @@ const vizMap = {
   [VIZ_TYPES.partition]: () =>
     loadVis(import(/* webpackChunkName: "partition" */ './Partition/adaptor.jsx')),
   [VIZ_TYPES.deck_scatter]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/scatter" */ './deckgl/layers/Scatter/Scatter.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/scatter" */ './deckgl/layers/Scatter/Scatter.jsx')),
   [VIZ_TYPES.deck_screengrid]: () =>
-    loadVis(
+    loadDeckGLVis(
       import(/* webpackChunkName: "deckgl/layers/screengrid" */ './deckgl/layers/Screengrid/Screengrid.jsx'),
     ),
   [VIZ_TYPES.deck_grid]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/grid" */ './deckgl/layers/Grid/Grid.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/grid" */ './deckgl/layers/Grid/Grid.jsx')),
   [VIZ_TYPES.deck_hex]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/hex" */ './deckgl/layers/Hex/Hex.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/hex" */ './deckgl/layers/Hex/Hex.jsx')),
   [VIZ_TYPES.deck_path]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/path" */ './deckgl/layers/Path/Path.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/path" */ './deckgl/layers/Path/Path.jsx')),
   [VIZ_TYPES.deck_geojson]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/geojson" */ './deckgl/layers/Geojson/Geojson.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/geojson" */ './deckgl/layers/Geojson/Geojson.jsx')),
   [VIZ_TYPES.deck_arc]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/arc" */ './deckgl/layers/Arc/Arc.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/arc" */ './deckgl/layers/Arc/Arc.jsx')),
   [VIZ_TYPES.deck_polygon]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/layers/polygon" */ './deckgl/layers/Polygon/Polygon.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/layers/polygon" */ './deckgl/layers/Polygon/Polygon.jsx')),
   [VIZ_TYPES.deck_multi]: () =>
-    loadVis(import(/* webpackChunkName: "deckgl/multi" */ './deckgl/Multi/Multi.jsx')),
+    loadDeckGLVis(import(/* webpackChunkName: "deckgl/multi" */ './deckgl/Multi/Multi.jsx')),
   [VIZ_TYPES.rose]: () => loadVis(import(/* webpackChunkName: "rose" */ './Rose/adaptor.jsx')),
 };
 
diff --git a/superset/assets/src/visualizations/models/BasicChartInput.js b/superset/assets/src/visualizations/models/BasicChartInput.js
deleted file mode 100644
index d4a5a32..0000000
--- a/superset/assets/src/visualizations/models/BasicChartInput.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import convertKeysToCamelCase from '../../utils/convertKeysToCamelCase';
-
-export default class BasicChartInput {
-  constructor(slice, payload, setControlValue) {
-    this.annotationData = slice.annotationData;
-    this.datasource = convertKeysToCamelCase(slice.datasource);
-    this.rawDatasource = slice.datasource;
-    this.filters = slice.getFilters();
-    this.formData = convertKeysToCamelCase(slice.formData);
-    this.onAddFilter = (...args) => {
-      slice.addFilter(...args);
-    };
-    this.onError = (...args) => {
-      slice.error(...args);
-    };
-    this.payload = payload;
-    this.setControlValue = setControlValue;
-  }
-}
diff --git a/superset/assets/src/visualizations/nvd3/transformProps.js b/superset/assets/src/visualizations/nvd3/transformProps.js
index 4445b91..0ff56bb 100644
--- a/superset/assets/src/visualizations/nvd3/transformProps.js
+++ b/superset/assets/src/visualizations/nvd3/transformProps.js
@@ -1,15 +1,17 @@
 import { isTruthy } from '../../utils/common';
 import { formatLabel } from './utils';
 
-export default function transformProps(basicChartInput) {
+export default function transformProps(chartProps) {
   const {
+    width,
+    height,
     annotationData,
     datasource,
     formData,
     onError,
     onAddFilter,
     payload,
-  } = basicChartInput;
+  } = chartProps;
 
   const {
     annotationLayers,
@@ -63,6 +65,8 @@ export default function transformProps(basicChartInput) {
     : rawData;
 
   return {
+    width,
+    height,
     data,
     annotationData,
     annotationLayers,
diff --git a/superset/assets/src/visualizations/wordcloud/transformProps.js b/superset/assets/src/visualizations/wordcloud/transformProps.js
index 7400a3a..ef824e9 100644
--- a/superset/assets/src/visualizations/wordcloud/transformProps.js
+++ b/superset/assets/src/visualizations/wordcloud/transformProps.js
@@ -9,8 +9,8 @@ function transformData(data, formData) {
   return transformedData;
 }
 
-export default function transformProps(basicChartInput) {
-  const { formData, payload } = basicChartInput;
+export default function transformProps(chartProps) {
+  const { width, height, formData, payload } = chartProps;
   const {
     colorScheme,
     rotation,
@@ -19,6 +19,8 @@ export default function transformProps(basicChartInput) {
   } = formData;
 
   return {
+    width,
+    height,
     data: transformData(payload.data, formData),
     colorScheme,
     rotation,


Mime
View raw message