elastic-charts icon indicating copy to clipboard operation
elastic-charts copied to clipboard

Published 20 hours ago • verified publisher icon elastic

Make the legend extra parameter customizable

Open markov00 opened this issue 5 years ago • 13 comments

Is your feature request related to a problem? Please describe. The current legend extra parameter is used to display the latest value on the data series, or the hovered data point value. We should make this configurable to show other values or statistics, like the total value, averages etc

Describe the solution you'd like We should move the legend props to it's own <Legend> component and allow the user to customize in some way the possible extra parameter

Describe alternatives you've considered n/a

Additional context continuation of https://github.com/elastic/elastic-charts/issues/246

Kibana Cross Issues

  • https://github.com/elastic/kibana/issues/19485
  • https://github.com/elastic/kibana/issues/16096
  • https://github.com/elastic/kibana/issues/10524
  • https://github.com/elastic/kibana/issues/6279

Checklist

  • [x] this request is checked against already exist requests
  • [x] every related Kibana issue is listed under Kibana Cross Issues list
  • [x] kibana cross issue tag is associated to the issue if any kibana cross issue is present

markov00 avatar Feb 20 '20 11:02 markov00

@markov00 @nickofthyme Not sure about your prioritization for 7.11, but this is another much-needed addition to the charts in order to display averages across selected time ranges in APM. Can you share an update on this? Thanks 👍

formgeist avatar Nov 24 '20 09:11 formgeist

+1 o11y case

I guess I expected it to show an aggregate value of the data, average of the entire data for average, max for the maximum line item, etc.

ghudgins avatar Nov 30 '21 19:11 ghudgins

+1 for the @elastic/protections-experience team, we could use a feature to show accumulated values when the user isn't mousing over anything in the chart. I see that the Alerts page currently has this feature, but the developers had to build an entirely new Legend component themselves.

PhilippeOberti avatar Oct 03 '22 14:10 PhilippeOberti

It would be great if one could provide a custom legend component like for the tooltip.

yannbolliger avatar Oct 25 '22 14:10 yannbolliger

It would be great if one could provide a custom legend component like for the tooltip.

@markov00 would you accept a PR if I was to try and implement this?

yannbolliger avatar Oct 27 '22 07:10 yannbolliger

Hi @yannbolliger such a task brings in a set of decisions that we should make before attempting an implementation:

  • What are we looking to expose in the API to provide this capability?
  • Is the current Legend Item object enough or does it need more details (the data table view related to such item for example)?
  • Do we want to expose full control over the value (giving the freedom to the user to send a custom function) or a set of predefined operations (sum, avg, last, min, max)?
  • How can we improve the legend style to accommodate correctly such metric? Today we don't describe such value, but a header will help a lot the readability of the legend.
  • Who should provide the formatting and how do we want to format such value? Does the legend needs to shrink/grow depending on that?
  • Is a value column enough or do we want to transform the legend to a table to allow multiple stats?
  • Does that value change with interactions (as it is today) in all cases? if so what will change to inform the user?

The current legend extra parameter was not actually well thought out when it was merged. It was pushed into the library to align the feature with a legacy functionality that we have in Kibana, so that is why I'm a bit hesitant about letting you try an implementation (I just don't want to waste your time and not accept the PR due to its implementation/logic). I'm very happy btw if you are interested in discussing this feature and how we can structure a good logic behind that.

markov00 avatar Oct 28 '22 13:10 markov00

There are also implications related to the width of the legend, such that allowing a fully custom element would require rethinking how we currently size the legend and legend items. Currently, we use CanvasRenderingContext2D.measureText() here to determine the max width of all labels + extra value strings to appropriately size the legend all while limiting reflows.

nickofthyme avatar Nov 01 '22 16:11 nickofthyme

I'm very happy btw if you are interested in discussing this feature and how we can structure a good logic behind that.

@markov00 @nickofthyme Thanks for the replies! I'm also interested in discussing this. Is there some easier way to discuss this than Github issue comments?

yannbolliger avatar Nov 07 '22 14:11 yannbolliger

@nickofthyme I've talked this morning with Yann and we moved the request toward https://github.com/elastic/elastic-charts/issues/862

markov00 avatar Nov 09 '22 09:11 markov00

Reopening since the need of making the "extra" parameter configurable is still there

markov00 avatar May 18 '23 13:05 markov00

Hey @formgeist, our dear @gvnmagni has explored a bit this space and how it will probably look like. Please take a look at https://github.com/elastic/elastic-charts/issues/580

markov00 avatar Jul 10 '23 15:07 markov00

Hey @formgeist, our dear @gvnmagni has explored a bit this space and how it will probably look like. Please take a look at #580

@markov00 sorry if I'm missing something, but is there a specific issue in that list of features that you're referring to?

formgeist avatar Jul 10 '23 18:07 formgeist

@formgeist sorry wrong link for you: https://github.com/elastic/elastic-charts/issues/2096

markov00 avatar Jul 11 '23 06:07 markov00