Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Maps] use EuiPopover instead of mapbox tooltip #45938

Merged
merged 8 commits into from
Sep 19, 2019

Conversation

nreese
Copy link
Contributor

@nreese nreese commented Sep 17, 2019

Fixes #43694 because now all the tooltip styling is done be EUI component instead of hacky mapbox CSS overrides

Implement Map tooltips with EuiPopover instead of map box tooltip. This provides the benefit that tooltips can now expand beyond the map container border, making tooltips much more usable when the map is embedded in a Dashboard and the map container is small.

There is one new behavior change in this PR. When a locked tooltip location is moved off screen by map moves, the tooltip is automatically closed.

Screen Shot 2019-09-18 at 12 07 20 PM

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@nreese nreese requested a review from a team as a code owner September 18, 2019 15:57
@elasticmachine
Copy link
Contributor

💔 Build Failed

@nreese nreese requested a review from nickpeihl September 18, 2019 18:17
@nreese nreese added release_note:enhancement [Deprecated-Use Team:Presentation]Team:Geo Former Team Label for Geo Team. Now use Team:Presentation v7.5.0 v8.0.0 labels Sep 18, 2019
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-gis

@elasticmachine
Copy link
Contributor

💔 Build Failed

Copy link
Member

@nickpeihl nickpeihl left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm.

tested in Chrome and code review

<EuiPopover
id="mapTooltip"
button={tooltipAnchor}
anchorPosition="upCenter"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

another slight behavior change is that the anchorPosition no longer changes to leftCenter or rightCenter as the tooltip approaches the left or right edge of the map. If this is not a simple fix I would not worry about it.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ya, not much we can do about that without lots of extra logic.

@elasticmachine
Copy link
Contributor

💔 Build Failed

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@nreese nreese merged commit 1ef6373 into elastic:master Sep 19, 2019
nreese added a commit to nreese/kibana that referenced this pull request Sep 19, 2019
* [Maps] use EuiPopover instead of mapbox tooltip

* update draw tooltip to use EuiPopover, remove mapbox popup css hacks

* use anchor size of 26px to fix positioning calculations

* close tooltip when position is no longer visible

* remove reevaluateTooltipPosition, its no longer needed

* fix problem with map move and hover tooltip location not also moving
nreese added a commit that referenced this pull request Sep 19, 2019
* [Maps] use EuiPopover instead of mapbox tooltip

* update draw tooltip to use EuiPopover, remove mapbox popup css hacks

* use anchor size of 26px to fix positioning calculations

* close tooltip when position is no longer visible

* remove reevaluateTooltipPosition, its no longer needed

* fix problem with map move and hover tooltip location not also moving
@nreese nreese mentioned this pull request Sep 25, 2019
9 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Maps] Tooltip callout styled for dark mode only when in top position
3 participants