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 <[email protected]>
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,