From 5e468f7a4cccc496ccafa52f9aba5b7688145fe4 Mon Sep 17 00:00:00 2001
From: serenajiang <serena.jiang@airbnb.com>
Date: Wed, 20 Apr 2022 09:36:28 -0700
Subject: [PATCH] fix(world-map): remove categorical color option (#19781)

---
 .../src/WorldMap.js                           | 24 +++++--------------
 .../src/controlPanel.ts                       |  4 ----
 .../src/transformProps.js                     | 12 ++--------
 3 files changed, 8 insertions(+), 32 deletions(-)

diff --git a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/WorldMap.js b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/WorldMap.js
index 0c81e98560..c7253e10d0 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/WorldMap.js
+++ b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/WorldMap.js
@@ -23,7 +23,6 @@ import { extent as d3Extent } from 'd3-array';
 import {
   getNumberFormatter,
   getSequentialSchemeRegistry,
-  CategoricalColorNamespace,
 } from '@superset-ui/core';
 import Datamap from 'datamaps/dist/datamaps.world.min';
 
@@ -56,8 +55,6 @@ function WorldMap(element, props) {
     showBubbles,
     linearColorScheme,
     color,
-    colorScheme,
-    sliceId,
   } = props;
   const div = d3.select(element);
   div.classed('superset-legacy-chart-world-map', true);
@@ -72,24 +69,15 @@ function WorldMap(element, props) {
     .domain([extRadius[0], extRadius[1]])
     .range([1, maxBubbleSize]);
 
-  const linearColorScale = getSequentialSchemeRegistry()
+  const colorScale = getSequentialSchemeRegistry()
     .get(linearColorScheme)
     .createLinearScale(d3Extent(filteredData, d => d.m1));
 
-  const colorScale = CategoricalColorNamespace.getScale(colorScheme);
-
-  const processedData = filteredData.map(d => {
-    let color = linearColorScale(d.m1);
-    if (colorScheme) {
-      // use color scheme instead
-      color = colorScale(d.name, sliceId);
-    }
-    return {
-      ...d,
-      radius: radiusScale(Math.sqrt(d.m2)),
-      fillColor: color,
-    };
-  });
+  const processedData = filteredData.map(d => ({
+    ...d,
+    radius: radiusScale(Math.sqrt(d.m2)),
+    fillColor: colorScale(d.m1),
+  }));
 
   const mapData = {};
   processedData.forEach(d => {
diff --git a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts
index 91664290dc..ec8aafc7b8 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts
@@ -106,7 +106,6 @@ const config: ControlPanelConfig = {
           },
         ],
         ['color_picker'],
-        ['color_scheme'],
         ['linear_color_scheme'],
       ],
     },
@@ -127,9 +126,6 @@ const config: ControlPanelConfig = {
     color_picker: {
       label: t('Bubble Color'),
     },
-    color_scheme: {
-      label: t('Categorical Color Scheme'),
-    },
     linear_color_scheme: {
       label: t('Country Color Scheme'),
     },
diff --git a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/transformProps.js b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/transformProps.js
index 3838ebfa5c..464dd53afa 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/transformProps.js
+++ b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/transformProps.js
@@ -20,14 +20,8 @@ import { rgb } from 'd3-color';
 
 export default function transformProps(chartProps) {
   const { width, height, formData, queriesData } = chartProps;
-  const {
-    maxBubbleSize,
-    showBubbles,
-    linearColorScheme,
-    colorPicker,
-    colorScheme,
-    sliceId,
-  } = formData;
+  const { maxBubbleSize, showBubbles, linearColorScheme, colorPicker } =
+    formData;
   const { r, g, b } = colorPicker;
 
   return {
@@ -38,7 +32,5 @@ export default function transformProps(chartProps) {
     showBubbles,
     linearColorScheme,
     color: rgb(r, g, b).hex(),
-    colorScheme,
-    sliceId,
   };
 }