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 5c2a788 [SIP-6] Migrate visualizations to new directory structure
(part 3 - nvd3) (#6006)
5c2a788 is described below
commit 5c2a7880cc6834651690f5ce7d1db3242fc45526
Author: Krist Wongsuphasawat <[email protected]>
AuthorDate: Wed Oct 3 10:18:04 2018 -0700
[SIP-6] Migrate visualizations to new directory structure (part 3 - nvd3)
(#6006)
* migrate nvd3
* update basicchartinput
---
superset/assets/src/visualizations/index.js | 2 +-
.../src/visualizations/models/BasicChartInput.js | 3 +
.../assets/src/visualizations/nvd3/LineMulti.js | 2 +-
superset/assets/src/visualizations/nvd3/NVD3Vis.js | 117 +--------------------
.../assets/src/visualizations/nvd3/ReactNVD3.js | 4 +
.../assets/src/visualizations/nvd3/adaptor.jsx | 5 +
.../src/visualizations/nvd3/transformProps.js | 112 ++++++++++++++++++++
7 files changed, 128 insertions(+), 117 deletions(-)
diff --git a/superset/assets/src/visualizations/index.js
b/superset/assets/src/visualizations/index.js
index 6507b97..5d9b3b4 100644
--- a/superset/assets/src/visualizations/index.js
+++ b/superset/assets/src/visualizations/index.js
@@ -59,7 +59,7 @@ const loadVis = promise =>
// deckgl visualizations don't use esModules, fix it?
return defaultExport.default || defaultExport;
});
-const loadNvd3 = () => loadVis(import(/* webpackChunkName: "nvd3_vis" */
'./nvd3/NVD3Vis.js'));
+const loadNvd3 = () => loadVis(import(/* webpackChunkName: "nvd3_vis" */
'./nvd3/adaptor.jsx'));
const vizMap = {
[VIZ_TYPES.area]: loadNvd3,
diff --git a/superset/assets/src/visualizations/models/BasicChartInput.js
b/superset/assets/src/visualizations/models/BasicChartInput.js
index 73aff95..d4a5a32 100644
--- a/superset/assets/src/visualizations/models/BasicChartInput.js
+++ b/superset/assets/src/visualizations/models/BasicChartInput.js
@@ -10,6 +10,9 @@ export default class BasicChartInput {
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/LineMulti.js
b/superset/assets/src/visualizations/nvd3/LineMulti.js
index 7309641..d5f1c48 100644
--- a/superset/assets/src/visualizations/nvd3/LineMulti.js
+++ b/superset/assets/src/visualizations/nvd3/LineMulti.js
@@ -1,5 +1,5 @@
import d3 from 'd3';
-import nvd3Vis from './NVD3Vis';
+import nvd3Vis from './adaptor';
import { getExploreLongUrl } from '../../explore/exploreUtils';
export default function lineMulti(slice, payload) {
diff --git a/superset/assets/src/visualizations/nvd3/NVD3Vis.js
b/superset/assets/src/visualizations/nvd3/NVD3Vis.js
index 4e47b8e..392e3a5 100644
--- a/superset/assets/src/visualizations/nvd3/NVD3Vis.js
+++ b/superset/assets/src/visualizations/nvd3/NVD3Vis.js
@@ -15,7 +15,6 @@ import { isTruthy } from '../../utils/common';
import {
computeBarChartWidth,
drawBarValues,
- formatLabel,
generateBubbleTooltipContent,
generateMultiLineTooltipContent,
generateRichLineTooltipContent,
@@ -176,8 +175,6 @@ const NOOP = () => {};
const formatter = d3.format('.3s');
function nvd3Vis(element, props) {
- PropTypes.checkPropTypes(propTypes, props, 'prop', 'NVD3Vis');
-
const {
data,
width: maxWidth,
@@ -901,116 +898,6 @@ function nvd3Vis(element, props) {
nv.addGraph(drawGraph);
}
+nvd3Vis.displayName = 'NVD3';
nvd3Vis.propTypes = propTypes;
-
-function adaptor(slice, payload) {
- const { formData, datasource, selector, annotationData } = slice;
- const {
- annotation_layers: annotationLayers,
- bar_stacked: isBarStacked,
- bottom_margin: bottomMargin,
- color_picker: baseColor,
- color_scheme: colorScheme,
- comparison_type: comparisonType,
- contribution,
- donut: isDonut,
- entity,
- labels_outside: isPieLabelOutside,
- left_margin: leftMargin,
- line_interpolation: lineInterpolation,
- max_bubble_size: maxBubbleSize,
- order_bars: orderBars,
- pie_label_type: pieLabelType,
- reduce_x_ticks: reduceXTicks,
- rich_tooltip: useRichTooltip,
- send_time_range: hasBrushAction,
- show_bar_value: showBarValue,
- show_brush: showBrush,
- show_controls: showControls,
- show_labels: showLabels,
- show_legend: showLegend,
- show_markers: showMarkers,
- size: sizeField,
- stacked_style: areaStackedStyle,
- viz_type: vizType,
- x: xField,
- x_axis_format: xAxisFormat,
- x_axis_label: xAxisLabel,
- x_axis_showminmax: xAxisShowMinMax,
- x_log_scale: xIsLogScale,
- x_ticks_layout: xTicksLayout,
- y: yField,
- y_axis_format: yAxisFormat,
- y_axis_2_format: yAxis2Format,
- y_axis_bounds: yAxisBounds,
- y_axis_label: yAxisLabel,
- y_axis_showminmax: yAxisShowMinMax,
- y_log_scale: yIsLogScale,
- } = formData;
-
- const element = document.querySelector(selector);
-
- const rawData = payload.data || [];
- const data = Array.isArray(rawData)
- ? rawData.map(row => ({
- ...row,
- key: formatLabel(row.key, datasource.verbose_map),
- }))
- : rawData;
-
- const props = {
- data,
- width: slice.width(),
- height: slice.height(),
- annotationData,
- annotationLayers,
- areaStackedStyle,
- baseColor,
- bottomMargin,
- colorScheme,
- comparisonType,
- contribution,
- entity,
- isBarStacked,
- isDonut,
- isPieLabelOutside,
- leftMargin,
- lineInterpolation,
- maxBubbleSize: parseInt(maxBubbleSize, 10),
- onBrushEnd: isTruthy(hasBrushAction) ? ((timeRange) => {
- slice.addFilter('__time_range', timeRange, false, true);
- }) : undefined,
- onError(err) { slice.error(err); },
- orderBars,
- pieLabelType,
- reduceXTicks,
- showBarValue,
- showBrush,
- showControls,
- showLabels,
- showLegend,
- showMarkers,
- sizeField,
- useRichTooltip,
- vizType,
- xAxisFormat,
- xAxisLabel,
- xAxisShowMinMax,
- xField,
- xIsLogScale,
- xTicksLayout,
- yAxisFormat,
- yAxis2Format,
- yAxisBounds,
- yAxisLabel,
- yAxisShowMinMax,
- yField,
- yIsLogScale,
- };
-
- slice.clearError();
-
- return nvd3Vis(element, props);
-}
-
-export default adaptor;
+export default nvd3Vis;
diff --git a/superset/assets/src/visualizations/nvd3/ReactNVD3.js
b/superset/assets/src/visualizations/nvd3/ReactNVD3.js
new file mode 100644
index 0000000..b7e884d
--- /dev/null
+++ b/superset/assets/src/visualizations/nvd3/ReactNVD3.js
@@ -0,0 +1,4 @@
+import reactify from '../../utils/reactify';
+import Component from './NVD3Vis';
+
+export default reactify(Component);
diff --git a/superset/assets/src/visualizations/nvd3/adaptor.jsx
b/superset/assets/src/visualizations/nvd3/adaptor.jsx
new file mode 100644
index 0000000..ce6e7b3
--- /dev/null
+++ b/superset/assets/src/visualizations/nvd3/adaptor.jsx
@@ -0,0 +1,5 @@
+import createAdaptor from '../../utils/createAdaptor';
+import Component from './ReactNVD3';
+import transformProps from './transformProps';
+
+export default createAdaptor(Component, transformProps);
diff --git a/superset/assets/src/visualizations/nvd3/transformProps.js
b/superset/assets/src/visualizations/nvd3/transformProps.js
new file mode 100644
index 0000000..4445b91
--- /dev/null
+++ b/superset/assets/src/visualizations/nvd3/transformProps.js
@@ -0,0 +1,112 @@
+import { isTruthy } from '../../utils/common';
+import { formatLabel } from './utils';
+
+export default function transformProps(basicChartInput) {
+ const {
+ annotationData,
+ datasource,
+ formData,
+ onError,
+ onAddFilter,
+ payload,
+ } = basicChartInput;
+
+ const {
+ annotationLayers,
+ barStacked,
+ bottomMargin,
+ colorPicker,
+ colorScheme,
+ comparisonType,
+ contribution,
+ donut,
+ entity,
+ labelsOutside,
+ leftMargin,
+ lineInterpolation,
+ maxBubbleSize,
+ orderBars,
+ pieLabelType,
+ reduceXTicks,
+ richTooltip,
+ sendTimeRange,
+ showBarValue,
+ showBrush,
+ showControls,
+ showLabels,
+ showLegend,
+ showMarkers,
+ size,
+ stackedStyle,
+ vizType,
+ x,
+ xAxisFormat,
+ xAxisLabel,
+ xAxisShowminmax,
+ xLogScale,
+ xTicksLayout,
+ y,
+ yAxisFormat,
+ yAxis2Format,
+ yAxisBounds,
+ yAxisLabel,
+ yAxisShowminmax,
+ yLogScale,
+ } = formData;
+
+ const rawData = payload.data || [];
+ const data = Array.isArray(rawData)
+ ? rawData.map(row => ({
+ ...row,
+ key: formatLabel(row.key, datasource.verbose_map),
+ }))
+ : rawData;
+
+ return {
+ data,
+ annotationData,
+ annotationLayers,
+ areaStackedStyle: stackedStyle,
+ baseColor: colorPicker,
+ bottomMargin,
+ colorScheme,
+ comparisonType,
+ contribution,
+ entity,
+ isBarStacked: barStacked,
+ isDonut: donut,
+ isPieLabelOutside: labelsOutside,
+ leftMargin,
+ lineInterpolation,
+ maxBubbleSize: parseInt(maxBubbleSize, 10),
+ onBrushEnd: isTruthy(sendTimeRange) ? ((timeRange) => {
+ onAddFilter('__time_range', timeRange, false, true);
+ }) : undefined,
+ onError,
+ orderBars,
+ pieLabelType,
+ reduceXTicks,
+ showBarValue,
+ showBrush,
+ showControls,
+ showLabels,
+ showLegend,
+ showMarkers,
+ sizeField: size,
+ useRichTooltip: richTooltip,
+ vizType,
+ xAxisFormat,
+ xAxisLabel,
+ xAxisShowMinMax: xAxisShowminmax,
+ xField: x,
+ xIsLogScale: xLogScale,
+ xTicksLayout,
+ yAxisFormat,
+ yAxis2Format,
+ yAxisBounds,
+ yAxisLabel,
+ yAxisShowMinMax: yAxisShowminmax,
+ yField: y,
+ yIsLogScale: yLogScale,
+ };
+}
