superset-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From christ...@apache.org
Subject [incubator-superset] branch lyftga updated: fix: propagate color mapping from dashboard to charts (#7289)
Date Wed, 17 Apr 2019 22:37:13 GMT
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 <47833996+khtruong@users.noreply.github.com>
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'),


Mime
View raw message