Metric progress bar fallback color should be unique

[nickofthyme]

Describe the feature:

When using the Lens Metric chart with color ranges, where the primary value of the metric is below the max value, the getColor function returns undefined and defaults to the same color as the metric background. This ends up looking like extra padding on the left side of the metric.

Thus there is little indication to the user that the value is actually beyond the color range domain.

Notice as the max value is increased, the values eventually become less than the max and scale properly, but when the values are greater than the max the default color (also the background color) is used.

Code is here:

kibana/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx

Lines 218 to 231 in 99f5192

	color:
	config.metric.palette && value != null
	? getColor(
	value,
	config.metric.palette,
	{
	metric: primaryMetricColumn.id,
	max: maxColId,
	breakdownBy: breakdownByColumn?.id,
	},
	data,
	rowIdx
	) ?? defaultColor
	: config.metric.color ?? defaultColor,

Describe a specific use case for the feature:
I think a possible solution to this is to default to the min/max value if the value is out of the color range. This would look like this...

Another option would be to make the default bar color show as a darker default different than the Metric background. This would look like...

We could build this default color selection into the editor panel.

CC: @markov00 @gvnmagni @drewdaemon

[elasticmachine]

Pinging @elastic/kibana-visualizations (Team:Visualizations)

[markov00]

hi @nickofthyme I'm not fully sure I understand the problem here. I've tested main and I can't replicate the specified behaviour.

Does it happens only under specific conditions, like only with static maximum value or formula?

[nickofthyme]

Oh yeah you're right, I only see the issue in this one case. Let me dig a bit deeper and see what's causing it.

[nickofthyme]

Closing in favor of #172297