[XY axis] Give the ability to change the colors opacity

[stratoula]

Describe the feature:
Right now the XY axis coloring works with the default opacity. We received feedback from our users that they prefer the styling of the vislib implementation which doesn't add an opacity to the colors. As a result on a dark background is easier to read:

XY Axis:

Vislib:

I suggest to add a new setting to the xy axis charts editor to adjust the colors opacity (TSVB already offers this ability)

It could be either a num input or a slider. Whatever suits better.

[elasticmachine]

Pinging @elastic/kibana-app (Team:KibanaApp)

[stratoula]

Another thing that @markov00 has mentioned and I agree are the dots that are quite big and confusing.
@elastic/kibana-design we want your input on this. Wdyt? As we want to remove the vislib implementation in the future, I think we should address this.

[ryankeairns]

Hey @stratoula ,

Another thing that @markov00 has mentioned and I agree are the dots that are quite big and confusing.
@elastic/kibana-design we want your input on this. Wdyt? As we want to remove the vislib implementation in the future, I think we should address this.

+1 for providing options. To that point, could the dots also be an option or have a size setting?

[stratoula]

@ryankeairns I think that we can only show/hide the dots but I ping @markov00 to confirm.
Update: I discussed it with Marco and yes we can also adjust the size!

[markov00]

Exactly, you can change the radius, fill, stroke of them, all at once or individually (as in the bubble-chart: you can test this on current visualize, hiding the line of a line chart and adding a metric for the dot size)
Please double check what happen with ophan data points (data points that doesn't have continuity with a previous and a next point)

We can also define a global policy to show points only under specific circumstances (just random numbers not valid ones):

• only if the data points are less then 10
• only if the chart is bigger then 100x50 px
• only if rendering 2 series
• only for line series

[stratoula]

There is something else we should also take under consideration. Here is a Lens and an XY visualization that depict exactly the same series

In Lens there are no data points, while on XY axis there are. Opacity is the same (the default). I think that these two types of visualizations should be the same because in the future we want to prompt our users to use Lens instead. And the transaction from vislib to xy axis showed us that the different styling can cause confusion to our users.

Same about opacity, it seems that there are users that want to be able to adjust it. What I want to say is that we should apply this feedback having also in mind Lens. So for example, I don't want to give the users the ability to change the opacity to XY axis but Lens doesn't do it.

cc @flash1293 @timroes

[flash1293]

From my perspective it would be great to add this feature to Visualize and Lens.

It would be a nice addition to the "series color" setting we already have:

cc @ghudgins @MichaelMarcialis