[Lens] Add point visibility option for area/line charts#222187
Merged
andrimal merged 22 commits intoelastic:mainfrom Jun 10, 2025
Merged
[Lens] Add point visibility option for area/line charts#222187andrimal merged 22 commits intoelastic:mainfrom
andrimal merged 22 commits intoelastic:mainfrom
Conversation
andrimal
added
release_note:enhancement
Team:Visualizations
Contributor
|
Pinging @elastic/kibana-visualizations (Team:Visualizations) |
dej611
reviewed
Jun 5, 2025
| @@ -141,6 +143,23 @@ export const VisualOptionsPopover: React.FC<VisualOptionsPopoverProps> = ({ | |||
| <ToolbarDivider /> | |||
Contributor
There was a problem hiding this comment.
Given the specificity of both this and point visibility to Area and Line chart types I would probably avoid to render this divider (as the hasAreaSettings is a pre-requirement of isHasNonBarSeries to be true).
This first divider makes the popover look a bit too "packed":
Contributor
Author
There was a problem hiding this comment.
Yes, I agree. Especially in the case of a chart with multiple layers (both bar + area/line) it was very packed. My initial concern was in the case where I have a chart with 2 layers of line and area, if it is clear that Point Visibility applies to both and not just the area chart because it is grouped with the fill opacity. But again I think it's a very simple/straight forward functionality.
After the change:
- Line Chart:
- Area Chart:
- Multiple Layer Chart (Line+Area+Bar):
Contributor
Author
There was a problem hiding this comment.
After further discussions, we decided to integrate the point visibility option with the rest of the line configs.
- Line chart:
- Area chart:
- Bar + Line:
- Bar + Area:
- Bar + Line + Area:
dej611
approved these changes
Jun 6, 2025
Contributor
Author
|
/ci |
Contributor
💚 Build Succeeded
Metrics [docs]Module Count
Public APIs missing comments
Async chunks
Page load bundle
Unknown metric groupsAPI count
History
|
Contributor
|
Starting backport for target branches: 8.19 |
kibanamachine
added a commit
to kibanamachine/kibana
that referenced
this pull request
Jun 10, 2025
## Summary Fix elastic#218770 This PR implements a point visibility option into the Appearance configuration of line and area charts by using a Button group with 3 options - _Auto, Show_ and _Hide_. - _Auto_: This should be the **default** option. It is based on the distance between the visible points. If the distance is too close (~40px), we are hiding the points, if it is larger then we visualize them. - _Show_: The points should always be visible. - _Hide_: The points should never be visible. ### Area Chart:  ### Line Chart:  ### Chart with multiple layers:  ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md) - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> (cherry picked from commit e314686)
Contributor
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation |
kibanamachine
added a commit
that referenced
this pull request
Jun 10, 2025
…) (#223239) # Backport This will backport the following commits from `main` to `8.19`: - [[Lens] Add point visibility option for area/line charts (#222187)](#222187) <!--- Backport version: 9.6.6 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Andreana Malama","email":"72010092+andrimal@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-06-10T13:31:58Z","message":"[Lens] Add point visibility option for area/line charts (#222187)\n\n## Summary\n\nFix #218770\n\nThis PR implements a point visibility option into the Appearance\nconfiguration of line and area charts by using a Button group with 3\noptions - _Auto, Show_ and _Hide_.\n\n- _Auto_: This should be the **default** option. It is based on the\ndistance between the visible points. If the distance is too close\n(~40px), we are hiding the points, if it is larger then we visualize\nthem.\n- _Show_: The points should always be visible.\n- _Hide_: The points should never be visible.\n\n### Area Chart:\n\n\n### Line Chart:\n\n\n### Chart with multiple layers: \n\n\n### Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers should verify this PR satisfies this list as well.\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n---------\n\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"e314686dba9fa25f91fba02849a8fe5f989fbe14","branchLabelMapping":{"^v9.1.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:enhancement","Team:Visualizations","Feature:Lens","backport:version","v9.1.0","v8.19.0"],"title":"[Lens] Add point visibility option for area/line charts","number":222187,"url":"https://github.com/elastic/kibana/pull/222187","mergeCommit":{"message":"[Lens] Add point visibility option for area/line charts (#222187)\n\n## Summary\n\nFix #218770\n\nThis PR implements a point visibility option into the Appearance\nconfiguration of line and area charts by using a Button group with 3\noptions - _Auto, Show_ and _Hide_.\n\n- _Auto_: This should be the **default** option. It is based on the\ndistance between the visible points. If the distance is too close\n(~40px), we are hiding the points, if it is larger then we visualize\nthem.\n- _Show_: The points should always be visible.\n- _Hide_: The points should never be visible.\n\n### Area Chart:\n\n\n### Line Chart:\n\n\n### Chart with multiple layers: \n\n\n### Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers should verify this PR satisfies this list as well.\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n---------\n\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"e314686dba9fa25f91fba02849a8fe5f989fbe14"}},"sourceBranch":"main","suggestedTargetBranches":["8.19"],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/222187","number":222187,"mergeCommit":{"message":"[Lens] Add point visibility option for area/line charts (#222187)\n\n## Summary\n\nFix #218770\n\nThis PR implements a point visibility option into the Appearance\nconfiguration of line and area charts by using a Button group with 3\noptions - _Auto, Show_ and _Hide_.\n\n- _Auto_: This should be the **default** option. It is based on the\ndistance between the visible points. If the distance is too close\n(~40px), we are hiding the points, if it is larger then we visualize\nthem.\n- _Show_: The points should always be visible.\n- _Hide_: The points should never be visible.\n\n### Area Chart:\n\n\n### Line Chart:\n\n\n### Chart with multiple layers: \n\n\n### Checklist\n\nCheck the PR satisfies following conditions. \n\nReviewers should verify this PR satisfies this list as well.\n\n- [x] Any text added follows [EUI's writing\nguidelines](https://elastic.github.io/eui/#/guidelines/writing), uses\nsentence case text and includes [i18n\nsupport](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md)\n- [x] [Unit or functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere updated or added to match the most common scenarios\n- [x] The PR description includes the appropriate Release Notes section,\nand the correct `release_note:*` label is applied per the\n[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)\n\n---------\n\nCo-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>","sha":"e314686dba9fa25f91fba02849a8fe5f989fbe14"}},{"branch":"8.19","label":"v8.19.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Andreana Malama <72010092+andrimal@users.noreply.github.com>
pmuellr
pushed a commit
to pmuellr/kibana
that referenced
this pull request
Jun 11, 2025
## Summary Fix elastic#218770 This PR implements a point visibility option into the Appearance configuration of line and area charts by using a Button group with 3 options - _Auto, Show_ and _Hide_. - _Auto_: This should be the **default** option. It is based on the distance between the visible points. If the distance is too close (~40px), we are hiding the points, if it is larger then we visualize them. - _Show_: The points should always be visible. - _Hide_: The points should never be visible. ### Area Chart:  ### Line Chart:  ### Chart with multiple layers:  ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md) - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
nickpeihl
pushed a commit
to nickpeihl/kibana
that referenced
this pull request
Jun 12, 2025
## Summary Fix elastic#218770 This PR implements a point visibility option into the Appearance configuration of line and area charts by using a Button group with 3 options - _Auto, Show_ and _Hide_. - _Auto_: This should be the **default** option. It is based on the distance between the visible points. If the distance is too close (~40px), we are hiding the points, if it is larger then we visualize them. - _Show_: The points should always be visible. - _Hide_: The points should never be visible. ### Area Chart:  ### Line Chart:  ### Chart with multiple layers:  ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md) - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
iblancof
pushed a commit
to iblancof/kibana
that referenced
this pull request
Jun 16, 2025
## Summary Fix elastic#218770 This PR implements a point visibility option into the Appearance configuration of line and area charts by using a Button group with 3 options - _Auto, Show_ and _Hide_. - _Auto_: This should be the **default** option. It is based on the distance between the visible points. If the distance is too close (~40px), we are hiding the points, if it is larger then we visualize them. - _Show_: The points should always be visible. - _Hide_: The points should never be visible. ### Area Chart:  ### Line Chart:  ### Chart with multiple layers:  ### Checklist Check the PR satisfies following conditions. Reviewers should verify this PR satisfies this list as well. - [x] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/src/platform/packages/shared/kbn-i18n/README.md) - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [x] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fix #218770
This PR implements a point visibility option into the Appearance configuration of line and area charts by using a Button group with 3 options - Auto, Show and Hide.
Area Chart:
Line Chart:
Chart with multiple layers:
Checklist
Check the PR satisfies following conditions.
Reviewers should verify this PR satisfies this list as well.
release_note:*label is applied per the guidelines