This is an automated email from the ASF dual-hosted git repository. giftig pushed a commit to branch label_colors in repository https://gitbox.apache.org/repos/asf/superset.git
commit 186f7acfa478ff7de79b0e3d250b502fa0a02dcc Author: Rob Moore <[email protected]> AuthorDate: Fri Oct 11 11:51:35 2024 +0100 Draft: chart-specific label_colors --- .../src/color/CategoricalColorNamespace.ts | 20 ++++++++++++++++---- .../src/color/CategoricalColorScale.ts | 22 ++++++++++++++++++---- .../packages/superset-ui-core/src/color/types.ts | 4 ++++ superset-frontend/src/utils/colorScheme.ts | 9 +++++++++ 4 files changed, 47 insertions(+), 8 deletions(-) diff --git a/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorNamespace.ts b/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorNamespace.ts index 9c56d5114b..328ca12ff8 100644 --- a/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorNamespace.ts +++ b/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorNamespace.ts @@ -18,7 +18,7 @@ */ import CategoricalColorScale from './CategoricalColorScale'; -import { ColorsLookup } from './types'; +import { ColorsLookup, ChartColorsLookup } from './types'; import getCategoricalSchemeRegistry from './CategoricalSchemeRegistrySingleton'; import stringifyAndTrim from './stringifyAndTrim'; @@ -26,6 +26,7 @@ export default class CategoricalColorNamespace { name: string; forcedItems: ColorsLookup; + perChartForcedItems: ChartColorsLookup; scales: { [key: string]: CategoricalColorScale; @@ -35,12 +36,15 @@ export default class CategoricalColorNamespace { this.name = name; this.scales = {}; this.forcedItems = {}; + this.perChartForcedItems = {}; } getScale(schemeId?: string) { const id = schemeId ?? getCategoricalSchemeRegistry().getDefaultKey() ?? ''; const scheme = getCategoricalSchemeRegistry().get(id); - return new CategoricalColorScale(scheme?.colors ?? [], this.forcedItems); + return new CategoricalColorScale( + scheme?.colors ?? [], this.forcedItems, this.perChartForcedItems + ); } /** @@ -50,14 +54,22 @@ export default class CategoricalColorNamespace { * @param {*} value value * @param {*} forcedColor color */ - setColor(value: string, forcedColor: string) { - this.forcedItems[stringifyAndTrim(value)] = forcedColor; + setColor(value: string, forcedColor: string, chartId?: string) { + if (chartId != null) { + let cleanChartId = stringifyAndTrim(chartId); + let perChart = this.perChartForcedItems[cleanChartId] || {}; + perChart[stringifyAndTrim(value)] = forcedColor; + this.perChartForcedItems[cleanChartId] = perChart; + } else { + this.forcedItems[stringifyAndTrim(value)] = forcedColor; + } return this; } resetColors() { this.forcedItems = {}; + this.perChartForcedItems = {}; } } diff --git a/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorScale.ts b/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorScale.ts index f97f84cdec..f80f7f7166 100644 --- a/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorScale.ts +++ b/superset-frontend/packages/superset-ui-core/src/color/CategoricalColorScale.ts @@ -19,7 +19,7 @@ import { scaleOrdinal, ScaleOrdinal } from 'd3-scale'; import { ExtensibleFunction } from '../models'; -import { ColorsInitLookup, ColorsLookup } from './types'; +import { ColorsInitLookup, ColorsLookup, ChartColorsLookup } from './types'; import stringifyAndTrim from './stringifyAndTrim'; import getLabelsColorMap from './LabelsColorMapSingleton'; import { getAnalogousColors } from './utils'; @@ -39,6 +39,7 @@ class CategoricalColorScale extends ExtensibleFunction { scale: ScaleOrdinal<{ toString(): string }, string>; forcedColors: ColorsLookup; + perChartForcedColors: ChartColorsLookup; labelsColorMapInstance: ReturnType<typeof getLabelsColorMap>; @@ -52,7 +53,11 @@ class CategoricalColorScale extends ExtensibleFunction { * @param {*} forcedColors optional parameter that comes from parent * (usually CategoricalColorNamespace) */ - constructor(colors: string[], forcedColors: ColorsInitLookup = {}) { + constructor( + colors: string[], + forcedColors: ColorsInitLookup = {}, + perChartForcedColors: ChartColorsLookup = {} + ) { super((value: string, sliceId?: number, colorScheme?: string) => this.getColor(value, sliceId, colorScheme), ); @@ -81,6 +86,7 @@ class CategoricalColorScale extends ExtensibleFunction { // forced colors from parent (usually CategoricalColorNamespace) // currently used in dashboards to set custom label colors this.forcedColors = forcedColors as ColorsLookup; + this.perChartForcedColors = perChartForcedColors; } /** @@ -112,8 +118,16 @@ class CategoricalColorScale extends ExtensibleFunction { */ getColor(value?: string, sliceId?: number, colorScheme?: string): string { const cleanedValue = stringifyAndTrim(value); - // priority: forced color (i.e. custom label colors) > shared color > scale color - const forcedColor = this.forcedColors?.[cleanedValue]; + + // priority: forced color (i.e. custom label colors) per chart > forced color per dashboard > + // shared color > scale color + let chartForcedColor = null; + if (sliceId != null) { + chartForcedColor = this.perChartForcedColors?.[stringifyAndTrim(sliceId)]?.[cleanedValue]; + } + console.log(`HODOR HODOR HODOR: ${chartForcedColor}`); + const forcedColor = chartForcedColor ?? this.forcedColors?.[cleanedValue]; + const isExistingLabel = this.chartLabelsColorMap.has(cleanedValue); let color = forcedColor || this.scale(cleanedValue); diff --git a/superset-frontend/packages/superset-ui-core/src/color/types.ts b/superset-frontend/packages/superset-ui-core/src/color/types.ts index d3fab4b971..9031b19746 100644 --- a/superset-frontend/packages/superset-ui-core/src/color/types.ts +++ b/superset-frontend/packages/superset-ui-core/src/color/types.ts @@ -25,6 +25,10 @@ export interface ColorsLookup { [key: string]: string; } +export interface ChartColorsLookup { + [key: string]: ColorsLookup; +} + export interface RgbaColor { r: number; g: number; diff --git a/superset-frontend/src/utils/colorScheme.ts b/superset-frontend/src/utils/colorScheme.ts index be4d3786e0..f70135c6db 100644 --- a/superset-frontend/src/utils/colorScheme.ts +++ b/superset-frontend/src/utils/colorScheme.ts @@ -124,6 +124,15 @@ export const applyColors = (metadata: Record<string, any>, fresh = false) => { categoricalNamespace.setColor(label, customLabelColors[label]); }); + // per-chart custom label colors + Object.keys(metadata?.chart_configuration).forEach(chartId => { + const perChartCustomLabelColors = metadata?.chart_configuration?.[chartId]?.label_colors || {}; + + Object.keys(perChartCustomLabelColors).forEach(label => { + categoricalNamespace.setColor(label, perChartCustomLabelColors[label], chartId); + }); + }); + // re-instantiate a fresh labels color map based on current scheme // will consider also just applied custom label colors refreshLabelsColorMap(metadata?.color_namespace, colorScheme);
