This is an automated email from the ASF dual-hosted git repository.
jli pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 9252d835b8 fix(deckgl): scatterplot fix categorical color (#35537)
9252d835b8 is described below
commit 9252d835b8bee37364f58a104b58b97998ec4c88
Author: Damian Pendrak <[email protected]>
AuthorDate: Tue Oct 14 20:07:57 2025 +0200
fix(deckgl): scatterplot fix categorical color (#35537)
---
.../src/CategoricalDeckGLContainer.tsx | 44 ++++++++++++++--------
.../src/layers/Scatter/buildQuery.ts | 8 ++--
.../src/layers/Scatter/controlPanel.ts | 5 +--
.../src/layers/Scatter/transformProps.ts | 4 +-
4 files changed, 36 insertions(+), 25 deletions(-)
diff --git
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/CategoricalDeckGLContainer.tsx
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/CategoricalDeckGLContainer.tsx
index 1400a15133..e032aefe28 100644
---
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/CategoricalDeckGLContainer.tsx
+++
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/CategoricalDeckGLContainer.tsx
@@ -156,13 +156,27 @@ const CategoricalDeckGLContainer = (props:
CategoricalDeckGLContainerProps) => {
switch (selectedColorScheme) {
case COLOR_SCHEME_TYPES.fixed_color: {
color = fd.color_picker || { r: 0, g: 0, b: 0, a: 100 };
+ const colorArray = [color.r, color.g, color.b, color.a * 255];
- return data.map(d => ({
- ...d,
- color: [color.r, color.g, color.b, color.a * 255],
- }));
+ return data.map(d => ({ ...d, color: colorArray }));
}
case COLOR_SCHEME_TYPES.categorical_palette: {
+ if (!fd.dimension) {
+ const fallbackColor = fd.color_picker || {
+ r: 0,
+ g: 0,
+ b: 0,
+ a: 100,
+ };
+ const colorArray = [
+ fallbackColor.r,
+ fallbackColor.g,
+ fallbackColor.b,
+ fallbackColor.a * 255,
+ ];
+ return data.map(d => ({ ...d, color: colorArray }));
+ }
+
return data.map(d => ({
...d,
color: hexToRGB(colorFn(d.cat_color, fd.slice_id)),
@@ -190,17 +204,17 @@ const CategoricalDeckGLContainer = (props:
CategoricalDeckGLContainerProps) => {
d.metric <= breakpoint.maxValue,
);
- return {
- ...d,
- color: breakpointForPoint
- ? [
- breakpointForPoint?.color.r,
- breakpointForPoint?.color.g,
- breakpointForPoint?.color.b,
- breakpointForPoint?.color.a * 255,
- ]
- : defaultBreakpointColor,
- };
+ if (breakpointForPoint) {
+ const pointColor = [
+ breakpointForPoint.color.r,
+ breakpointForPoint.color.g,
+ breakpointForPoint.color.b,
+ breakpointForPoint.color.a * 255,
+ ];
+ return { ...d, color: pointColor };
+ }
+
+ return { ...d, color: defaultBreakpointColor };
});
}
default: {
diff --git
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/buildQuery.ts
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/buildQuery.ts
index 66b7146190..73c1482a04 100644
---
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/buildQuery.ts
+++
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/buildQuery.ts
@@ -46,14 +46,14 @@ export interface DeckScatterFormData
min_radius?: number;
max_radius?: number;
color_picker?: { r: number; g: number; b: number; a: number };
- category_name?: string;
+ dimension?: string;
}
export default function buildQuery(formData: DeckScatterFormData) {
const {
spatial,
point_radius_fixed,
- category_name,
+ dimension,
js_columns,
tooltip_contents,
} = formData;
@@ -67,8 +67,8 @@ export default function buildQuery(formData:
DeckScatterFormData) {
const spatialColumns = getSpatialColumns(spatial);
let columns = [...(baseQueryObject.columns || []), ...spatialColumns];
- if (category_name) {
- columns.push(category_name);
+ if (dimension) {
+ columns.push(dimension);
}
const columnStrings = columns.map(col =>
diff --git
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
index 9545dcd1be..f3c369ef34 100644
---
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
+++
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
@@ -37,7 +37,6 @@ import {
tooltipContents,
tooltipTemplate,
} from '../../utilities/Shared_DeckGL';
-import { COLOR_SCHEME_TYPES } from '../../utilities/utils';
const config: ControlPanelConfig = {
onInit: controlState => ({
@@ -134,9 +133,7 @@ const config: ControlPanelConfig = {
controlSetRows: [
[legendPosition],
[legendFormat],
- ...generateDeckGLColorSchemeControls({
- defaultSchemeType: COLOR_SCHEME_TYPES.fixed_color,
- }),
+ ...generateDeckGLColorSchemeControls({}),
],
},
{
diff --git
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/transformProps.ts
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/transformProps.ts
index baadec33c9..7f4a300886 100644
---
a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/transformProps.ts
+++
b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/transformProps.ts
@@ -95,7 +95,7 @@ function processScatterData(
export default function transformProps(chartProps: ChartProps) {
const { rawFormData: formData } = chartProps;
- const { spatial, point_radius_fixed, category_name, js_columns } =
+ const { spatial, point_radius_fixed, dimension, js_columns } =
formData as DeckScatterFormData;
const radiusMetricLabel = getMetricLabelFromFormData(point_radius_fixed);
@@ -104,7 +104,7 @@ export default function transformProps(chartProps:
ChartProps) {
records,
spatial,
radiusMetricLabel,
- category_name,
+ dimension,
js_columns,
);
