[Lens] Area/line charts report last bucket empty #153079

rajvi-patel-22 · 2023-03-10T08:04:47Z

Kibana version: 8.5.0

Elasticsearch version: 8.5.0

Describe the issue:

The new feature was introduced in Kibana [Lens] Show value in legend. This feature is already available in TSVB but there is a minor difference over there. In TSVB, it shows value of last bucket without hovering over the chart. On the other hand, in lens, when this feature is enabled it doesn't show any default values. User must need to hover the chart to see the values.

In Lens,

Scenario 1 : Show value option is enabled and by default it doesn't show any value in the legend.

Scenario 2 : Show value option is enabled and it shows value when hover the chart.

In TSVB,

Scenario 1 : By default it shows value of last bucket in the legend (which is 0).

Scenario 2 : It shows value of count at particular timestamp when hover the chart.

Steps to reproduce:

Go to Dashboard > Create Line chart in lens.
Click on the Legend > select Show in Display option and enable Show value toggle

Expected behavior:

Lens should show value of last bucket in legend when show value option is enabled and not hovering over the chart.

Actual behavior:

The value is not shown in the legend by default even when show value option is enabled.

elasticmachine · 2023-03-10T09:13:28Z

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

stratoula · 2023-03-10T09:24:07Z

The problem here is that the last bucket for area, line charts is empty for some reason, this why you don't see the value in the legend

Bar chart

Area chart

markov00 · 2023-03-28T15:16:47Z

@stratoula I have investigated this and seems a behavior that we should handle within elastic-charts and not in Kibana.
What Kibana did in the past was probably a way to "bypass" this problem instead of fixing it at elastic-charts level.
I will drop a ech ticket here when ready

stratoula · 2023-03-29T06:03:50Z

Great @markov00, thanx for the investigation!

NotSoOld · 2023-05-12T12:55:48Z

@markov00 I would like to ask whether there any updates on this issue. This is, unfortunately, the problem which stops my team from migrating from TSVB to Lens.
Any help needed?

markov00 · 2023-05-17T09:32:19Z

hey @NotSoOld sorry for the slow investigation on this topic. I'm resuming this work right now and I will update when I have news on how to procede

markov00 · 2023-05-18T13:47:31Z

@NotSoOld I'm working on it as you can see from the above linked PR/issue

## Note about `@elastic/charts` BREAKING CHANGE In version 62.0.0 we introduced a breaking change in time-series charts: the default "extra" legend value now represents the last data point in the passed data array. It doesn't try to reconcile anymore the data computed domain with a passed domain in `Settings.xDomain` but instead it renders directly the last element of the passed array. The reasons for this change can be found at elastic/elastic-charts#2115 or can be asked directly to our `#charts` slack channel There are a couple of implementations in Kibana that use both the `showLegendExtra` in the chart configuration. I've commented them out so that the owner teams can help me fix this breaking change if necessary. In general, the fix requires that the data passed to the chart contains all the buckets, even empty buckets with null/zeros should be passed. To achieve this, your ES query you should provide the `extended_bounds` settings in the [data histogram agg](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-histogram-aggregation.html#search-aggregations-bucket-histogram-aggregation-extended-bounds) and use a `min_doc_count:0`. If that doesn't work, please ping me and we can find an alternative solution. This should not limit the query performance, generating empty date buckets on the server side has a similar or even less performance impact than what we were doing on the client side to calculate every missing bucket, to fillup the chart in particular situations. Please double-check your queries/data fetches and push a commit to this PR or ping me with the updated data fetch strategy. fix #153079 This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [@elastic/charts](https://togithub.com/elastic/elastic-charts) | [`61.2.0` -> `63.0.0`](https://renovatebot.com/diffs/npm/@elastic%2fcharts/61.2.0/63.0.0) | [![age](https://developer.mend.io/api/mc/badges/age/npm/@elastic%2fcharts/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/@elastic%2fcharts/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/@elastic%2fcharts/61.2.0/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/@elastic%2fcharts/61.2.0/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes <details> <summary>elastic/elastic-charts (@elastic/charts)</summary> ### [`v63.0.0`](https://togithub.com/elastic/elastic-charts/blob/HEAD/CHANGELOG.md#6300-2024-01-24) [Compare Source](https://togithub.com/elastic/elastic-charts/compare/v62.0.0...v63.0.0) ##### Features - **legend:** expose extra raw values ([#2308](https://togithub.com/elastic/elastic-charts/issues/2308)) ([85bfe06](https://togithub.com/elastic/elastic-charts/commit/85bfe0668d66fd24e78f2bba8be4570fa926e94c)) ##### BREAKING CHANGES - **legend:** The `CustomLegend.item` now exposes both the `raw` and the `formatted` version of the extra value. ### [`v62.0.0`](https://togithub.com/elastic/elastic-charts/blob/HEAD/CHANGELOG.md#6200-2024-01-23) [Compare Source](https://togithub.com/elastic/elastic-charts/compare/v61.2.0...v62.0.0) ##### Bug Fixes - **deps:** update dependency [@elastic/eui](https://togithub.com/elastic/eui) to ^91.3.1 ([#2286](https://togithub.com/elastic/elastic-charts/issues/2286)) ([d4d7b5d](https://togithub.com/elastic/elastic-charts/commit/d4d7b5db6681ec0c65ef8b7e576f1b5fc8b5433a)) - **deps:** update dependency [@elastic/eui](https://togithub.com/elastic/eui) to v92 ([#2290](https://togithub.com/elastic/elastic-charts/issues/2290)) ([cc537fa](https://togithub.com/elastic/elastic-charts/commit/cc537faf43d88acc9abab7e0dac9360bd460b574)) - **legend:** improve last value handling ([#2115](https://togithub.com/elastic/elastic-charts/issues/2115)) ([9f99447](https://togithub.com/elastic/elastic-charts/commit/9f9944734c4a13bfe9e4ffc9f4c0f39da5f9931f)) ##### BREAKING CHANGES - **legend:** In cartesian charts, the default legend value now represents the data points that coincide with the latest datum in the X domain. Please consider passing every data point, even the empty ones (like empty buckets/bins/etc) if your x data domain doesn't fully cover a custom x domain passed to the chart configuration. </details> --- --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Marco Vettorello <[email protected]> Co-authored-by: Stratoula Kalafateli <[email protected]> Co-authored-by: Elena Stoeva <[email protected]>

## Note about `@elastic/charts` BREAKING CHANGE In version 62.0.0 we introduced a breaking change in time-series charts: the default "extra" legend value now represents the last data point in the passed data array. It doesn't try to reconcile anymore the data computed domain with a passed domain in `Settings.xDomain` but instead it renders directly the last element of the passed array. The reasons for this change can be found at elastic/elastic-charts#2115 or can be asked directly to our `#charts` slack channel There are a couple of implementations in Kibana that use both the `showLegendExtra` in the chart configuration. I've commented them out so that the owner teams can help me fix this breaking change if necessary. In general, the fix requires that the data passed to the chart contains all the buckets, even empty buckets with null/zeros should be passed. To achieve this, your ES query you should provide the `extended_bounds` settings in the [data histogram agg](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-histogram-aggregation.html#search-aggregations-bucket-histogram-aggregation-extended-bounds) and use a `min_doc_count:0`. If that doesn't work, please ping me and we can find an alternative solution. This should not limit the query performance, generating empty date buckets on the server side has a similar or even less performance impact than what we were doing on the client side to calculate every missing bucket, to fillup the chart in particular situations. Please double-check your queries/data fetches and push a commit to this PR or ping me with the updated data fetch strategy. fix elastic#153079 This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [@elastic/charts](https://togithub.com/elastic/elastic-charts) | [`61.2.0` -> `63.0.0`](https://renovatebot.com/diffs/npm/@elastic%2fcharts/61.2.0/63.0.0) | [![age](https://developer.mend.io/api/mc/badges/age/npm/@elastic%2fcharts/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/@elastic%2fcharts/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/@elastic%2fcharts/61.2.0/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/@elastic%2fcharts/61.2.0/63.0.0?slim=true)](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes <details> <summary>elastic/elastic-charts (@&elastic#8203;elastic/charts)</summary> ### [`v63.0.0`](https://togithub.com/elastic/elastic-charts/blob/HEAD/CHANGELOG.md#6300-2024-01-24) [Compare Source](https://togithub.com/elastic/elastic-charts/compare/v62.0.0...v63.0.0) ##### Features - **legend:** expose extra raw values ([#&elastic#8203;2308](https://togithub.com/elastic/elastic-charts/issues/2308)) ([85bfe06](https://togithub.com/elastic/elastic-charts/commit/85bfe0668d66fd24e78f2bba8be4570fa926e94c)) ##### BREAKING CHANGES - **legend:** The `CustomLegend.item` now exposes both the `raw` and the `formatted` version of the extra value. ### [`v62.0.0`](https://togithub.com/elastic/elastic-charts/blob/HEAD/CHANGELOG.md#6200-2024-01-23) [Compare Source](https://togithub.com/elastic/elastic-charts/compare/v61.2.0...v62.0.0) ##### Bug Fixes - **deps:** update dependency [@&elastic#8203;elastic/eui](https://togithub.com/elastic/eui) to ^91.3.1 ([#&elastic#8203;2286](https://togithub.com/elastic/elastic-charts/issues/2286)) ([d4d7b5d](https://togithub.com/elastic/elastic-charts/commit/d4d7b5db6681ec0c65ef8b7e576f1b5fc8b5433a)) - **deps:** update dependency [@&elastic#8203;elastic/eui](https://togithub.com/elastic/eui) to v92 ([#&elastic#8203;2290](https://togithub.com/elastic/elastic-charts/issues/2290)) ([cc537fa](https://togithub.com/elastic/elastic-charts/commit/cc537faf43d88acc9abab7e0dac9360bd460b574)) - **legend:** improve last value handling ([#&elastic#8203;2115](https://togithub.com/elastic/elastic-charts/issues/2115)) ([9f99447](https://togithub.com/elastic/elastic-charts/commit/9f9944734c4a13bfe9e4ffc9f4c0f39da5f9931f)) ##### BREAKING CHANGES - **legend:** In cartesian charts, the default legend value now represents the data points that coincide with the latest datum in the X domain. Please consider passing every data point, even the empty ones (like empty buckets/bins/etc) if your x data domain doesn't fully cover a custom x domain passed to the chart configuration. </details> --- --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Marco Vettorello <[email protected]> Co-authored-by: Stratoula Kalafateli <[email protected]> Co-authored-by: Elena Stoeva <[email protected]>

botelastic bot added the needs-team Issues missing a team label label Mar 10, 2023

This was referenced Mar 10, 2023

[O11y][IBM MQ] Lens Migration elastic/integrations#5494

Closed

[O11y][IBM MQ] Lens migration for visualizations to Kibana version 8.5.0 elastic/integrations#5495

Merged

stratoula added the Team:Visualizations Visualization editors, elastic-charts and infrastructure label Mar 10, 2023

botelastic bot removed the needs-team Issues missing a team label label Mar 10, 2023

stratoula added Feature:Lens needs-team Issues missing a team label labels Mar 10, 2023

botelastic bot removed the needs-team Issues missing a team label label Mar 10, 2023

stratoula added bug Fixes for quality problems that affect the customer experience impact:medium Addressing this issue will have a medium level of impact on the quality/strength of our product. labels Mar 10, 2023

stratoula changed the title ~~[Lens] Show value in legend feature does not show default values~~ [Lens] Area/line charts report last bucket empty Mar 10, 2023

kush-elastic mentioned this issue Mar 10, 2023

Lens Migration of OBS integrations elastic/integrations#5221

Closed

36 tasks

stratoula mentioned this issue Mar 10, 2023

[Lens] Display last bucket in lines/areas #153088

Closed

This was referenced Mar 13, 2023

[O11y][PHP-FPM] Lens migration for visualizations to kibana version 8.4.0 elastic/integrations#5521

Merged

[O11y][PHP-FPM] Lens Migration elastic/integrations#5520

Closed

This was referenced Mar 21, 2023

[O11y][Couchbase] Lens migration for visualizations to kibana version 8.4.0 elastic/integrations#5612

Merged

[O11y][Apache] Lens Migration elastic/integrations#5617

Closed

markov00 mentioned this issue Mar 23, 2023

Kibana Visualize Click Event (Customize Time Range) #17821

Open

stratoula added blocked Feature:ElasticCharts Issues related to the elastic-charts library labels Mar 29, 2023

This was referenced May 18, 2023

feat(legend): expose legend extra configuration elastic/elastic-charts#2043

Draft

[Legend] improve handling for legend rendered value elastic/elastic-charts#2044

Open

markov00 mentioned this issue Jul 27, 2023

fix(legend): improve last value handling elastic/elastic-charts#2115

Merged

8 tasks

stratoula assigned markov00 Aug 8, 2023

stratoula mentioned this issue Jan 29, 2024

Update dependency @elastic/charts to v63 (main) #175316

Merged

mistic closed this as completed in #175316 Feb 8, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Lens] Area/line charts report last bucket empty #153079

[Lens] Area/line charts report last bucket empty #153079

rajvi-patel-22 commented Mar 10, 2023

elasticmachine commented Mar 10, 2023

stratoula commented Mar 10, 2023

markov00 commented Mar 28, 2023

stratoula commented Mar 29, 2023

NotSoOld commented May 12, 2023

markov00 commented May 17, 2023

markov00 commented May 18, 2023

[Lens] Area/line charts report last bucket empty #153079

[Lens] Area/line charts report last bucket empty #153079

Comments

rajvi-patel-22 commented Mar 10, 2023

elasticmachine commented Mar 10, 2023

stratoula commented Mar 10, 2023

markov00 commented Mar 28, 2023

stratoula commented Mar 29, 2023

NotSoOld commented May 12, 2023

markov00 commented May 17, 2023

markov00 commented May 18, 2023