This is an automated email from the ASF dual-hosted git repository.
christine pushed a commit to branch lyftga
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
The following commit(s) were added to refs/heads/lyftga by this push:
new 81a1e53 fix: propagate color mapping from dashboard to charts (#7289)
81a1e53 is described below
commit 81a1e5322b36a7d3006b6dd5b6ab33b0ac1fc913
Author: Kim Truong <[email protected]>
AuthorDate: Wed Apr 17 15:36:59 2019 -0700
fix: propagate color mapping from dashboard to charts (#7289)
* fix: propagate color map from dashboard to chart
* fix: handle cache scenario
* fix: give default values
---
superset/assets/backendSync.json | 5 ++
.../assets/src/dashboard/components/Dashboard.jsx | 2 +
superset/assets/src/dashboard/containers/Chart.jsx | 3 +-
.../util/charts/getFormDataWithExtraFilters.js | 10 ++++
.../components/controls/ColorMapControl.jsx | 54 ++++++++++++++++++++++
.../src/explore/components/controls/index.js | 2 +
superset/assets/src/explore/controlPanels/Area.js | 2 +-
superset/assets/src/explore/controlPanels/Bar.js | 2 +-
.../assets/src/explore/controlPanels/BoxPlot.js | 2 +-
.../assets/src/explore/controlPanels/Bubble.js | 2 +-
superset/assets/src/explore/controlPanels/Chord.js | 2 +-
.../assets/src/explore/controlPanels/Compare.js | 2 +-
.../assets/src/explore/controlPanels/DeckArc.js | 2 +-
.../src/explore/controlPanels/DeckScatter.js | 2 +-
.../assets/src/explore/controlPanels/DistBar.js | 2 +-
.../assets/src/explore/controlPanels/DualLine.js | 2 +-
.../assets/src/explore/controlPanels/Histogram.js | 2 +-
superset/assets/src/explore/controlPanels/Line.js | 2 +-
.../assets/src/explore/controlPanels/LineMulti.js | 2 +-
.../assets/src/explore/controlPanels/Partition.js | 2 +-
superset/assets/src/explore/controlPanels/Pie.js | 2 +-
superset/assets/src/explore/controlPanels/Rose.js | 2 +-
.../assets/src/explore/controlPanels/Sankey.js | 2 +-
.../assets/src/explore/controlPanels/Sunburst.js | 2 +-
.../assets/src/explore/controlPanels/Treemap.js | 2 +-
.../assets/src/explore/controlPanels/WordCloud.js | 2 +-
.../assets/src/explore/controlPanels/sections.jsx | 2 +-
superset/assets/src/explore/controls.jsx | 10 ++++
28 files changed, 106 insertions(+), 22 deletions(-)
diff --git a/superset/assets/backendSync.json b/superset/assets/backendSync.json
index 68684bd..2285f50 100644
--- a/superset/assets/backendSync.json
+++ b/superset/assets/backendSync.json
@@ -3278,6 +3278,11 @@
"renderTrigger": true,
"description": "The color scheme for rendering chart"
},
+ "label_colors": {
+ "type": "ColorMapControl",
+ "label": "Color Map",
+ "default": {}
+ },
"significance_level": {
"type": "TextControl",
"label": "Significance Level",
diff --git a/superset/assets/src/dashboard/components/Dashboard.jsx
b/superset/assets/src/dashboard/components/Dashboard.jsx
index 32cc376..b26cde6 100644
--- a/superset/assets/src/dashboard/components/Dashboard.jsx
+++ b/superset/assets/src/dashboard/components/Dashboard.jsx
@@ -153,6 +153,8 @@ class Dashboard extends React.PureComponent {
chart,
dashboardMetadata: this.props.dashboardInfo.metadata,
filters: this.props.dashboardState.filters,
+ colorScheme: this.props.dashboardState.colorScheme,
+ colorNamespace: this.props.dashboardState.colorNamespace,
sliceId: chart.id,
});
diff --git a/superset/assets/src/dashboard/containers/Chart.jsx
b/superset/assets/src/dashboard/containers/Chart.jsx
index c0926db..5b14c1b 100644
--- a/superset/assets/src/dashboard/containers/Chart.jsx
+++ b/superset/assets/src/dashboard/containers/Chart.jsx
@@ -43,7 +43,7 @@ function mapStateToProps(
) {
const { id } = ownProps;
const chart = chartQueries[id] || {};
- const { filters, colorScheme } = dashboardState;
+ const { filters, colorScheme, colorNamespace } = dashboardState;
return {
chart,
@@ -59,6 +59,7 @@ function mapStateToProps(
dashboardMetadata: dashboardInfo.metadata,
filters,
colorScheme,
+ colorNamespace,
sliceId: id,
}),
editMode: dashboardState.editMode,
diff --git
a/superset/assets/src/dashboard/util/charts/getFormDataWithExtraFilters.js
b/superset/assets/src/dashboard/util/charts/getFormDataWithExtraFilters.js
index a928a12..5869a09 100644
--- a/superset/assets/src/dashboard/util/charts/getFormDataWithExtraFilters.js
+++ b/superset/assets/src/dashboard/util/charts/getFormDataWithExtraFilters.js
@@ -16,6 +16,8 @@
* specific language governing permissions and limitations
* under the License.
*/
+import { isEqual } from 'lodash';
+import { CategoricalColorNamespace } from '@superset-ui/color';
import getEffectiveExtraFilters from './getEffectiveExtraFilters';
// We cache formData objects so that our connected container components don't
always trigger
@@ -29,14 +31,21 @@ export default function getFormDataWithExtraFilters({
dashboardMetadata,
filters,
colorScheme,
+ colorNamespace,
sliceId,
}) {
+ // Propagate color mapping to chart
+ const scale = CategoricalColorNamespace.getScale(colorScheme,
colorNamespace);
+ const labelColors = scale.getColorMap();
+
// if dashboard metadata + filters have not changed, use cache if possible
if (
(cachedDashboardMetadataByChart[sliceId] || {}) === dashboardMetadata &&
(cachedFiltersByChart[sliceId] || {}) === filters &&
(colorScheme == null ||
cachedFormdataByChart[sliceId].color_scheme === colorScheme) &&
+ cachedFormdataByChart[sliceId].color_namespace === colorNamespace &&
+ isEqual(cachedFormdataByChart[sliceId].label_colors, labelColors) &&
!!cachedFormdataByChart[sliceId]
) {
return cachedFormdataByChart[sliceId];
@@ -45,6 +54,7 @@ export default function getFormDataWithExtraFilters({
const formData = {
...chart.formData,
...(colorScheme && { color_scheme: colorScheme }),
+ label_colors: labelColors,
extra_filters: getEffectiveExtraFilters({
dashboardMetadata,
filters,
diff --git
a/superset/assets/src/explore/components/controls/ColorMapControl.jsx
b/superset/assets/src/explore/components/controls/ColorMapControl.jsx
new file mode 100644
index 0000000..08cddef
--- /dev/null
+++ b/superset/assets/src/explore/components/controls/ColorMapControl.jsx
@@ -0,0 +1,54 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import PropTypes from 'prop-types';
+import React from 'react';
+import { CategoricalColorNamespace } from '@superset-ui/color';
+
+const propTypes = {
+ onChange: PropTypes.func,
+ value: PropTypes.object,
+ colorScheme: PropTypes.string,
+ colorNamespace: PropTypes.string,
+};
+
+const defaultProps = {
+ onChange: () => {},
+ value: {},
+ colorScheme: undefined,
+ colorNamespace: undefined,
+};
+
+export default class ColorMapControl extends React.PureComponent {
+ constructor(props) {
+ super(props);
+ Object.keys(this.props.value).forEach((label) => {
+ CategoricalColorNamespace.getScale(
+ this.props.colorScheme,
+ this.props.colorNamespace,
+ ).setColor(label, this.props.value[label]);
+ });
+ }
+
+ render() {
+ return null;
+ }
+}
+
+ColorMapControl.propTypes = propTypes;
+ColorMapControl.defaultProps = defaultProps;
diff --git a/superset/assets/src/explore/components/controls/index.js
b/superset/assets/src/explore/components/controls/index.js
index d1a2f2c..32a8d44 100644
--- a/superset/assets/src/explore/components/controls/index.js
+++ b/superset/assets/src/explore/components/controls/index.js
@@ -20,6 +20,7 @@ import AnnotationLayerControl from './AnnotationLayerControl';
import BoundsControl from './BoundsControl';
import CheckboxControl from './CheckboxControl';
import CollectionControl from './CollectionControl';
+import ColorMapControl from './ColorMapControl';
import ColorPickerControl from './ColorPickerControl';
import ColorSchemeControl from './ColorSchemeControl';
import DatasourceControl from './DatasourceControl';
@@ -45,6 +46,7 @@ const controlMap = {
BoundsControl,
CheckboxControl,
CollectionControl,
+ ColorMapControl,
ColorPickerControl,
ColorSchemeControl,
DatasourceControl,
diff --git a/superset/assets/src/explore/controlPanels/Area.js
b/superset/assets/src/explore/controlPanels/Area.js
index 73b5994..b978cd1 100644
--- a/superset/assets/src/explore/controlPanels/Area.js
+++ b/superset/assets/src/explore/controlPanels/Area.js
@@ -30,7 +30,7 @@ export default {
controlSetRows: [
['show_brush', 'show_legend'],
['line_interpolation', 'stacked_style'],
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['rich_tooltip', 'show_controls'],
],
},
diff --git a/superset/assets/src/explore/controlPanels/Bar.js
b/superset/assets/src/explore/controlPanels/Bar.js
index c3cbc73..b21fb47 100644
--- a/superset/assets/src/explore/controlPanels/Bar.js
+++ b/superset/assets/src/explore/controlPanels/Bar.js
@@ -28,7 +28,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['show_brush', 'show_legend', 'show_bar_value'],
['rich_tooltip', 'bar_stacked'],
['line_interpolation', 'show_controls'],
diff --git a/superset/assets/src/explore/controlPanels/BoxPlot.js
b/superset/assets/src/explore/controlPanels/BoxPlot.js
index 142c1d6..1cdf320 100644
--- a/superset/assets/src/explore/controlPanels/BoxPlot.js
+++ b/superset/assets/src/explore/controlPanels/BoxPlot.js
@@ -34,7 +34,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['whisker_options', 'x_ticks_layout'],
],
},
diff --git a/superset/assets/src/explore/controlPanels/Bubble.js
b/superset/assets/src/explore/controlPanels/Bubble.js
index 638e6d1..891fe29 100644
--- a/superset/assets/src/explore/controlPanels/Bubble.js
+++ b/superset/assets/src/explore/controlPanels/Bubble.js
@@ -38,7 +38,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['show_legend', null],
],
},
diff --git a/superset/assets/src/explore/controlPanels/Chord.js
b/superset/assets/src/explore/controlPanels/Chord.js
index 18ae6eb..b932c3f 100644
--- a/superset/assets/src/explore/controlPanels/Chord.js
+++ b/superset/assets/src/explore/controlPanels/Chord.js
@@ -37,7 +37,7 @@ export default {
expanded: true,
controlSetRows: [
['y_axis_format', null],
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
},
],
diff --git a/superset/assets/src/explore/controlPanels/Compare.js
b/superset/assets/src/explore/controlPanels/Compare.js
index 091e8db..3c50834 100644
--- a/superset/assets/src/explore/controlPanels/Compare.js
+++ b/superset/assets/src/explore/controlPanels/Compare.js
@@ -28,7 +28,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
},
{
diff --git a/superset/assets/src/explore/controlPanels/DeckArc.js
b/superset/assets/src/explore/controlPanels/DeckArc.js
index d54d59d..e0bee75 100644
--- a/superset/assets/src/explore/controlPanels/DeckArc.js
+++ b/superset/assets/src/explore/controlPanels/DeckArc.js
@@ -42,7 +42,7 @@ export default {
label: t('Arc'),
controlSetRows: [
['color_picker', 'target_color_picker'],
- ['dimension', 'color_scheme'],
+ ['dimension', 'color_scheme', 'label_colors'],
['stroke_width', 'legend_position'],
],
},
diff --git a/superset/assets/src/explore/controlPanels/DeckScatter.js
b/superset/assets/src/explore/controlPanels/DeckScatter.js
index 7947622..8e60029 100644
--- a/superset/assets/src/explore/controlPanels/DeckScatter.js
+++ b/superset/assets/src/explore/controlPanels/DeckScatter.js
@@ -62,7 +62,7 @@ export default {
label: t('Point Color'),
controlSetRows: [
['color_picker', 'legend_position'],
- ['dimension', 'color_scheme'],
+ ['dimension', 'color_scheme', 'label_colors'],
],
},
{
diff --git a/superset/assets/src/explore/controlPanels/DistBar.js
b/superset/assets/src/explore/controlPanels/DistBar.js
index fff22d6..41b944e 100644
--- a/superset/assets/src/explore/controlPanels/DistBar.js
+++ b/superset/assets/src/explore/controlPanels/DistBar.js
@@ -36,7 +36,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['show_legend', 'show_bar_value'],
['bar_stacked', 'order_bars'],
['y_axis_format', 'y_axis_label'],
diff --git a/superset/assets/src/explore/controlPanels/DualLine.js
b/superset/assets/src/explore/controlPanels/DualLine.js
index 4792b4a..11d930f 100644
--- a/superset/assets/src/explore/controlPanels/DualLine.js
+++ b/superset/assets/src/explore/controlPanels/DualLine.js
@@ -27,7 +27,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['x_axis_format'],
],
},
diff --git a/superset/assets/src/explore/controlPanels/Histogram.js
b/superset/assets/src/explore/controlPanels/Histogram.js
index 1df4184..d95ff80 100644
--- a/superset/assets/src/explore/controlPanels/Histogram.js
+++ b/superset/assets/src/explore/controlPanels/Histogram.js
@@ -35,7 +35,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['link_length'],
['x_axis_label', 'y_axis_label'],
['global_opacity'],
diff --git a/superset/assets/src/explore/controlPanels/Line.js
b/superset/assets/src/explore/controlPanels/Line.js
index 012976a..a92427d 100644
--- a/superset/assets/src/explore/controlPanels/Line.js
+++ b/superset/assets/src/explore/controlPanels/Line.js
@@ -28,7 +28,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['show_brush', 'send_time_range', 'show_legend'],
['rich_tooltip', 'show_markers'],
['line_interpolation'],
diff --git a/superset/assets/src/explore/controlPanels/LineMulti.js
b/superset/assets/src/explore/controlPanels/LineMulti.js
index 0966712..71c0182 100644
--- a/superset/assets/src/explore/controlPanels/LineMulti.js
+++ b/superset/assets/src/explore/controlPanels/LineMulti.js
@@ -27,7 +27,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['prefix_metric_with_slice_name', null],
['show_legend', 'show_markers'],
['line_interpolation', null],
diff --git a/superset/assets/src/explore/controlPanels/Partition.js
b/superset/assets/src/explore/controlPanels/Partition.js
index 2bee218..a450da2 100644
--- a/superset/assets/src/explore/controlPanels/Partition.js
+++ b/superset/assets/src/explore/controlPanels/Partition.js
@@ -33,7 +33,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['number_format', 'date_time_format'],
['partition_limit', 'partition_threshold'],
['log_scale', 'equal_date_size'],
diff --git a/superset/assets/src/explore/controlPanels/Pie.js
b/superset/assets/src/explore/controlPanels/Pie.js
index ee9481b..e3b1203 100644
--- a/superset/assets/src/explore/controlPanels/Pie.js
+++ b/superset/assets/src/explore/controlPanels/Pie.js
@@ -37,7 +37,7 @@ export default {
['pie_label_type', 'number_format'],
['donut', 'show_legend'],
['show_labels', 'labels_outside'],
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
},
],
diff --git a/superset/assets/src/explore/controlPanels/Rose.js
b/superset/assets/src/explore/controlPanels/Rose.js
index 5939d0c..135b0d5 100644
--- a/superset/assets/src/explore/controlPanels/Rose.js
+++ b/superset/assets/src/explore/controlPanels/Rose.js
@@ -27,7 +27,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['number_format', 'date_time_format'],
['rich_tooltip', 'rose_area_proportion'],
],
diff --git a/superset/assets/src/explore/controlPanels/Sankey.js
b/superset/assets/src/explore/controlPanels/Sankey.js
index dfb337a..c7c2f21 100644
--- a/superset/assets/src/explore/controlPanels/Sankey.js
+++ b/superset/assets/src/explore/controlPanels/Sankey.js
@@ -34,7 +34,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
},
],
diff --git a/superset/assets/src/explore/controlPanels/Sunburst.js
b/superset/assets/src/explore/controlPanels/Sunburst.js
index 1272c83..6d84b2d 100644
--- a/superset/assets/src/explore/controlPanels/Sunburst.js
+++ b/superset/assets/src/explore/controlPanels/Sunburst.js
@@ -35,7 +35,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
},
],
diff --git a/superset/assets/src/explore/controlPanels/Treemap.js
b/superset/assets/src/explore/controlPanels/Treemap.js
index 9ed05d9..8342ee5 100644
--- a/superset/assets/src/explore/controlPanels/Treemap.js
+++ b/superset/assets/src/explore/controlPanels/Treemap.js
@@ -34,7 +34,7 @@ export default {
label: t('Chart Options'),
expanded: true,
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
['treemap_ratio'],
['number_format'],
],
diff --git a/superset/assets/src/explore/controlPanels/WordCloud.js
b/superset/assets/src/explore/controlPanels/WordCloud.js
index 7566a5a..d7dd43d 100644
--- a/superset/assets/src/explore/controlPanels/WordCloud.js
+++ b/superset/assets/src/explore/controlPanels/WordCloud.js
@@ -35,7 +35,7 @@ export default {
controlSetRows: [
['size_from', 'size_to'],
['rotation'],
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
},
],
diff --git a/superset/assets/src/explore/controlPanels/sections.jsx
b/superset/assets/src/explore/controlPanels/sections.jsx
index e3b32ca..e4ad95c 100644
--- a/superset/assets/src/explore/controlPanels/sections.jsx
+++ b/superset/assets/src/explore/controlPanels/sections.jsx
@@ -42,7 +42,7 @@ export const datasourceAndVizType = {
export const colorScheme = {
label: t('Color Scheme'),
controlSetRows: [
- ['color_scheme'],
+ ['color_scheme', 'label_colors'],
],
};
diff --git a/superset/assets/src/explore/controls.jsx
b/superset/assets/src/explore/controls.jsx
index be1e56f..1f63a23 100644
--- a/superset/assets/src/explore/controls.jsx
+++ b/superset/assets/src/explore/controls.jsx
@@ -2090,6 +2090,16 @@ export const controls = {
schemes: () => categoricalSchemeRegistry.getMap(),
},
+ label_colors: {
+ type: 'ColorMapControl',
+ label: t('Color Map'),
+ default: {},
+ mapStateToProps: state => ({
+ colorNamespace: state.form_data.color_namespace,
+ colorScheme: state.form_data.color_scheme,
+ }),
+ },
+
significance_level: {
type: 'TextControl',
label: t('Significance Level'),
