Skip to content

[Maps] Add filter actions to tooltips#33635

Merged
thomasneirynck merged 29 commits intoelastic:masterfrom
thomasneirynck:maps/tooltip_filter
Apr 8, 2019
Merged

[Maps] Add filter actions to tooltips#33635
thomasneirynck merged 29 commits intoelastic:masterfrom
thomasneirynck:maps/tooltip_filter

Conversation

@thomasneirynck
Copy link
Copy Markdown
Contributor

@thomasneirynck thomasneirynck commented Mar 21, 2019

Closes #32736

This PR contains:

Refactors

  • creates typing for individual tooltip-properties

Changes/additions

  • use grid layout for tooltips
  • show filter actions only in read-only mode (ie. when embedded in dashboard)
  • add phrase filtering for any string property on any ES-source
  • add phrase filtering for any property that is joined to other ES-sources (e.g. EMS layer)

Known issues:

  • joined data on the map does not update based on changing filters (regardless if the filter is sent from the map, or from another visualization)

Other todos:

  • add functional tests for tooltips use jest tests for contents
  • detect presence of filter-bar iso using isReadOnly embeddables are always filterable right now
  • design (it needs it!)
    • do not show close button when hovering
    • do not show filters when hovering
    • change to + icon for filter creation button
    • change mouse-pointer when tooltip is "lockable" on click

Discuss:

  • should the map take "ownership" of filters (similar to the input controls visualization) (?) NO. maybe in another phase
  • should tooltips remain on the map after filtering (?) if so, what would be the best mechanism to introduce this (e.g. track doc-ids across data-updates. (?) NO. tackle this as separate improvement. right now, tooltips are removed after filtering

image

@thomasneirynck thomasneirynck added WIP Work in progress Team:Geo Former Team Label for Geo Team. Now use Team:Presentation v8.0.0 v7.2.0 labels Mar 21, 2019
@thomasneirynck thomasneirynck requested a review from a team as a code owner March 21, 2019 03:40
@elasticmachine
Copy link
Copy Markdown
Contributor

Pinging @elastic/kibana-gis

@elasticmachine
Copy link
Copy Markdown
Contributor

💔 Build Failed

Comment thread x-pack/plugins/maps/public/components/map/feature_tooltip.js Outdated
Comment thread x-pack/plugins/maps/public/shared/layers/sources/es_join_source.js Outdated
Comment thread x-pack/plugins/maps/public/shared/layers/util/tooltip_property.js Outdated
@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

@thomasneirynck thomasneirynck removed the WIP Work in progress label Mar 29, 2019
@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

Comment thread x-pack/plugins/maps/public/components/map/feature_tooltip.test.js Outdated
Comment thread x-pack/plugins/maps/public/components/map/mb/view.js Outdated
@thomasneirynck thomasneirynck requested review from cchaos and nreese April 5, 2019 21:46
@elasticmachine
Copy link
Copy Markdown
Contributor

💔 Build Failed

@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

Comment thread x-pack/plugins/maps/public/shared/layers/sources/es_join_source.js Outdated
Comment thread x-pack/plugins/maps/public/shared/layers/sources/vector_source.js Outdated
Comment thread x-pack/plugins/maps/public/shared/layers/tooltips/es_tooltip_property.js Outdated
@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

for (let i = 0; i < this._joins.length; i++) {
const propsFromJoin = await this._joins[i].filterAndFormatPropertiesForTooltip(properties);
Object.assign(tooltipsFromSource, propsFromJoin);
allTooltips = [...allTooltips, ...propsFromJoin];
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Instead of recreating the array on each iteration, how about something more like this?

  async getPropertiesForTooltip(properties) {
    const sourceTooltipProperties =  await this._source.filterAndFormatPropertiesToHtml(properties);
    this._addJoinsToSourceTooltips(sourceTooltipProperties);

    // tooltip properties added by joins. For example, aggregation metrics
    const joinTooltipProperties = [];
    for (let i = 0; i < this._joins.length; i++) {
      const propsFromJoin = await this._joins[i].filterAndFormatPropertiesForTooltip(properties);
      joinTooltipProperties.push(...propsFromJoin);
    }
    return [...sourceTooltipProperties, ...joinTooltipProperties];
  }

Copy link
Copy Markdown
Contributor

@nreese nreese left a comment

Choose a reason for hiding this comment

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

lgtm
code review, tested in chrome

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

release_note:enhancement Team:Geo Former Team Label for Geo Team. Now use Team:Presentation v7.2.0 v8.0.0

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Maps] Improve tooltip menus

4 participants