feat(tooltip): stickTo vertical middle of the cursor#1163
Merged
markov00 merged 13 commits intoelastic:masterfrom Jun 3, 2021
Merged
feat(tooltip): stickTo vertical middle of the cursor#1163markov00 merged 13 commits intoelastic:masterfrom
markov00 merged 13 commits intoelastic:masterfrom
Conversation
This commit moves the main tooltip anchor within the echContainer, that keeps track itself of the legend when positioned on top or left of the chart. This allows us to remove the need to add the legend positional values to the chart dimension object
nickofthyme
reviewed
May 25, 2021
Collaborator
nickofthyme
left a comment
There was a problem hiding this comment.
LGTM, I still need to test more locally but will leave a review in the meantime.
src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts
Show resolved
Hide resolved
2 tasks
nickofthyme
approved these changes
Jun 3, 2021
Collaborator
nickofthyme
left a comment
There was a problem hiding this comment.
Tested locally with a multitude of option combinations. LGTM
nickofthyme
pushed a commit
that referenced
this pull request
Jun 4, 2021
# [30.0.0](v29.2.0...v30.0.0) (2021-06-04) ### Bug Fixes * **domain:** custom domain should not filter data ([#1181](#1181)) ([76e8dca](76e8dca)), closes [#1129](#1129) * **value_labels:** zero as a valid value for textBorder and borderWidth ([#1182](#1182)) ([a64f333](a64f333)) * annotation tooltip display when remounting specs ([#1167](#1167)) ([8408600](8408600)) * render nodeLabel formatted text into the nodes ([#1173](#1173)) ([b44bdff](b44bdff)) ### Features * **axis:** allow pixel domain padding for y axes ([#1145](#1145)) ([7c1fa8e](7c1fa8e)) * apply value formatter to the default legend item label ([#1190](#1190)) ([71474a5](71474a5)) * **tooltip:** stickTo vertical middle of the cursor ([#1163](#1163)) ([380363b](380363b)), closes [#1108](#1108) * **wordcloud:** click and over events on text ([#1180](#1180)) ([196fb6a](196fb6a)), closes [#1156](#1156) ### BREAKING CHANGES * **value_labels:** the `textBorder` of `ValueFillDefinition` is now optional or a number only
Collaborator
|
🎉 This PR is included in version 30.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
AMoo-Miki
pushed a commit
to AMoo-Miki/OpenSearch-Dashboards
that referenced
this pull request
Feb 10, 2022
# [30.0.0](elastic/elastic-charts@v29.2.0...v30.0.0) (2021-06-04) ### Bug Fixes * **domain:** custom domain should not filter data ([opensearch-project#1181](elastic/elastic-charts#1181)) ([92ba84c](elastic/elastic-charts@92ba84c)), closes [opensearch-project#1129](elastic/elastic-charts#1129) * **value_labels:** zero as a valid value for textBorder and borderWidth ([#1182](elastic/elastic-charts#1182)) ([880fbf1](elastic/elastic-charts@880fbf1)) * annotation tooltip display when remounting specs ([opensearch-project#1167](elastic/elastic-charts#1167)) ([7163951](elastic/elastic-charts@7163951)) * render nodeLabel formatted text into the nodes ([opensearch-project#1173](elastic/elastic-charts#1173)) ([0de9688](elastic/elastic-charts@0de9688)) ### Features * **axis:** allow pixel domain padding for y axes ([#1145](elastic/elastic-charts#1145)) ([6787728](elastic/elastic-charts@6787728)) * apply value formatter to the default legend item label ([opensearch-project#1190](elastic/elastic-charts#1190)) ([20108bb](elastic/elastic-charts@20108bb)) * **tooltip:** stickTo vertical middle of the cursor ([#1163](elastic/elastic-charts#1163)) ([b858fb3](elastic/elastic-charts@b858fb3)), closes [opensearch-project#1108](elastic/elastic-charts#1108) * **wordcloud:** click and over events on text ([opensearch-project#1180](elastic/elastic-charts#1180)) ([adbf341](elastic/elastic-charts@adbf341)), closes [opensearch-project#1156](elastic/elastic-charts#1156) ### BREAKING CHANGES * **value_labels:** the `textBorder` of `ValueFillDefinition` is now optional or a number only
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
2 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
The
Settings.tooltip.stickToprop, used to fix the tooltip movement on the free axis cursor, is enhanced withMiddle,CenterandMousePositionvalues.MousePositionis the default behavior that moves the tooltip along the free axis following the cursor position.MiddleandCentercan be used to fix the tooltip position in the middle of the chart respective for horizontally laid charts and the vertical ones.Details
This should be used carefully with the correct tooltip placement:
Middlewith tooltip placementLeftorRightThe above example shows a tooltip with
stickTo: Middle, placement: LeftCenter(used on vertically oriented charts) with tooltip placementToporBottomThe example shows a tooltip with
stickTo: Center, placement: Bottomwhen using
Top,Bottomyou can use the placement you prefer but usually a good set is:Bottom,TopThe example shows a tooltip with
stickTo: Bottom, placement: TopConnected issues
This complete a missing feature asked by APM regarding the tooltip positioning #921
fix #1108
Checklist
Delete any items that are not applicable to this PR.
src/index.ts(and stories only import from../srcexcept for test data & storybook)