Skip to content

[6.x] [ML] Improve Explorer Chart labels. (#23494)#23597

Merged
walterra merged 1 commit intoelastic:6.xfrom
walterra:backport/6.x/pr-23494
Sep 28, 2018
Merged

[6.x] [ML] Improve Explorer Chart labels. (#23494)#23597
walterra merged 1 commit intoelastic:6.xfrom
walterra:backport/6.x/pr-23494

Conversation

@walterra
Copy link
Copy Markdown
Contributor

Backports the following commits to 6.x:

Improves the display of the Explorer Chart labels to fix the following issues:
- Long chart labels could be cut off, so it's not possible to tell what entity fields a chart is referring to. A workaround is to hover the info icon tooltip but that's really slow and cumbersome if you have to do it for every chart.
- The list of entity fields and its values is an unformatted text blob which makes it hard to read and tell which values refer to which field.

Changes:
- If any of the chart labels is longer than 60 chars, the entity fields will wrap to a new line (for all charts to a achieve a consistent look).
- Entity fields use EuiBadge and some custom formatting to make it easier to see field/value pairs.
- If the detector description is too long, it still uses ellipsis for text-overflow:
- If the entity badges are too long, they will be just cut off to the right. There's no simple CSS fix for that, we cannot use ellipsis and we don't want to wrap those badges again because then multiple charts could have different heights. I experimented with gradients but that turned out to be somewhat unreliable. I still consider this a good enough improvement compare to the previous version and would like to leave a tweak for that to a follow up PR.
- If there are mixed detectors with and without entity fields and the existing one wrap, multiple charts are aligned considered the height of the entity fields on display:
- Additionally, this changes the link to the single series viewer from custom code using a Font Awesome icon to use EuiButtonEmpty with the same EUI based icon and a tooltip.
@walterra walterra added the backport This PR is a backport of another PR label Sep 28, 2018
@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

@walterra walterra self-assigned this Sep 28, 2018
@walterra walterra added :ml Feature:ml-results legacy - do not use labels Sep 28, 2018
@elasticmachine
Copy link
Copy Markdown
Contributor

Pinging @elastic/ml-ui

@walterra walterra merged commit 6e4ffe9 into elastic:6.x Sep 28, 2018
@walterra walterra deleted the backport/6.x/pr-23494 branch September 28, 2018 09:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport This PR is a backport of another PR Feature:ml-results legacy - do not use :ml

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants