Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Consistent, global color configuration for query and field values #6480

Closed
tbragin opened this issue Mar 9, 2016 · 5 comments · Fixed by #162389
Closed

Consistent, global color configuration for query and field values #6480

tbragin opened this issue Mar 9, 2016 · 5 comments · Fixed by #162389
Labels
enhancement New value added to drive a business result Feature:Visualizations Generic visualization features (in case no more specific feature label is available) Team:Visualizations Visualization editors, elastic-charts and infrastructure

Comments

@tbragin
Copy link
Contributor

tbragin commented Mar 9, 2016

Two main options exist for configuring color of a series today (in Kibana 4.4):

(1) Global setting in Advanced Settings which associates a particular string in the legend value (e.g. "error") with a color, introduced in Kibana 4.2.

screen shot 2016-03-08 at 8 57 53 pm

screen shot 2016-03-08 at 8 57 46 pm

(2) Per-chart color picker that works by clicking on a legend, introduced in Kibana 4.4. This configures a color for a legend value of a specific visualization.

screen shot 2016-03-08 at 8 35 22 pm

However, there are a couple of notable limitations (see below).

Limitation 1. Legends are used inconsistently as far as association with colors go. For instance, pie chart Terms breakdown shows values in the legend, but not the bar chart. You can get the values to show up in the legend by doing a second Terms breakdown, but that's sort of a hack.

screen shot 2016-03-08 at 8 53 09 pm

screen shot 2016-03-08 at 8 41 16 pm

screen shot 2016-03-08 at 8 41 02 pm

Limitation 2. In some cases, e.g. with Filters Agg that includes a star query, that trick doesn't work.

screen shot 2016-03-08 at 8 51 14 pm

screen shot 2016-03-08 at 8 43 25 pm

Proposal is to provide a consistent, non-hacky way (via Advanced Settings?) to associate a value either in the legend or in the axis label with a color. Ideally, there'd be a way to refer to an exact value or just a substring.

Keywords: color directory, color map

@pemontto
Copy link

👍 I currently use the second terms agg hack a lot

@tbragin tbragin added the Feature:Visualizations Generic visualization features (in case no more specific feature label is available) label Nov 1, 2016
@epixa epixa removed the P3 label Apr 25, 2017
@timroes timroes added the Team:Visualizations Visualization editors, elastic-charts and infrastructure label Sep 16, 2018
@nreese
Copy link
Contributor

nreese commented Mar 1, 2019

The Maps application is also in need of a way to define colors for field values - #32202.

What about doing this at the index-pattern level for the field? Field formatters already exist for the purpose of transforming the field value text before display. What about adding a new type of formatter to a field, called a Classifier. The Classifier would convert the value into a class - which could be a color. Then users could define how to classify values for a field and have a unified color palette across Kibana.

@thomasneirynck @timroes @Bargs @lukasolson thoughts?

@timroes
Copy link
Contributor

timroes commented Mar 1, 2019

I am a bit skeptical about putting that into index patterns right now. We have seen that very often users don't want to handle that kind of formatting on a per index basis but different on a per visualization level (e.g. see #16821). So our idea was in general to move formatting more towards the actual visualization and trying to get more away from field formatters in the future.

Also we would like to go more in a direction where we have customizable color palettes (#17764). I am wondering if those "color palettes" might be a better place to actually allow "static mapping" between values (or value ranges) and colors.

@nreese
Copy link
Contributor

nreese commented Mar 1, 2019

We have seen that very often users don't want to handle that kind of formatting on a per index basis but different on a per visualization level

I would argue that most users want consistent coloring across all visualizations. It is very hard to track values across charts if their color changes from chart to chart and it is very tedious to configure the colors for each chart.

Allowing users to override the defaults from the index-pattern makes sense but you still need a way to consistently display data across saved objects without a lot of manual work

@thomasneirynck
Copy link
Contributor

I'm in agreement with @nreese .

We need a way for it to be consistent across visualizations. Index-patterns seem an appropriate place to put this (as we are already doing this with all the other formatters).

Of course, visualizations/maps/... can provide a way for users to override this. This would be the intent in the Maps-app as well.

  • users could select to use the color of the formatter (if they want consistency)
  • users could also manually define the color for a given class of features

But the ability to reuse a classifier across multiple maps, across multiple visualizations would be really powerful.

@markov00 markov00 added enhancement New value added to drive a business result and removed release_note:enhancement labels Feb 2, 2023
markov00 added a commit that referenced this issue Sep 28, 2023
## Summary

This PR introduces the new color mapping feature into Lens.

The color mapping feature is introduced as a standalone sharable
component available from `@kbn/coloring`. The
[README.md](https://github.com/elastic/kibana/blob/ddd216457d66912de43c7688ae99044c2c34bbd2/packages/kbn-coloring/src/shared_components/color_mapping/README.md)
file describes the components and the logic behind it.

The Color Mapping component is also connected to Lens and is available
in the following charts:
- XY (you can specify the mappings from a breakdown dimension
- Partition (you can specify the mappings from the main slice/group by
dimension)
- Tag cloud (you can specify the mappings from the tags dimension)

This MVP feature will be released under the Tech Preview flag.
This PR needs to prove the user experience and the ease of use. UI
styles, design improvements and embellishments will be released in
subsequent PRs.

The current MVP-provided palettes are just a placeholder. I'm
coordinating with @gvnmagni for a final set of palettes.

close #155037
close #6480
fix #28618
fix #96044
fix #101942
fix #112839
fix #116634


## Release note

This feature introduces the ability to change and map colors to break
down dimensions in Lens. The feature provides an improved way to specify
colors and their association with categories by giving the user a
predefined set of color choices
or customized one that drives the user toward a correct color selection.
It provides ways to pick new colors and generate gradients. 
This feature is in Tech Preview and is enabled by default on every new
visualization but can be turned off at will.

![image](https://github.com/elastic/kibana/assets/1421091/d03e59f8-4a6f-4761-ab4c-c53a57c1723a)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New value added to drive a business result Feature:Visualizations Generic visualization features (in case no more specific feature label is available) Team:Visualizations Visualization editors, elastic-charts and infrastructure
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants