feat(series): markSizeAccessor and BubbleSeries (alpha) by nickofthyme · Pull Request #559 · elastic/elastic-charts

nickofthyme · 2020-02-19T18:28:08Z

Summary

Closes #533

Allow for a markSizeAccessor to render as radius size for point values. Copied Kibana logic for dotRadio using a step function, but this could be replaced with our own continuous sizing function.

Add BubbleSeries spec. This spec only draws points with no lines. The unique aspect of this type is that it uses the d3-delaunay spatial indexing approach. Currently, this does not work well with other chart spec types as the tooltip will show all values in range even on different x values. This is NOT a scatter plot, this type will come in another PR in the future.

Tasks:

Clip dot radius at boundaries.
Fix highlighter to select dot in range from left or right (up/down works)
Sort dots to render the largest radii in the back.
Fix mysterious x-axis disappearance 👽 (fix: redux connect issue related to spec upserting #563)

Bubble

Area

Line

Checklist

Any consumer-facing exports were added to src/index.ts (and stories only import from ../src except for test data & storybook)
This was checked for cross-browser compatibility, including a check against IE11
Proper documentation or storybook story was added for features that require explanation or tutorials
Unit tests were updated or added to match the most common scenarios
Each commit follows the convention

wylieconlon · 2020-02-20T16:57:17Z

This looks like a first step towards a real scatter chart, right? #502

wylieconlon · 2020-02-20T17:12:56Z

Instead of calling this dot, can you call it something like markSize? The mark in this case is a dot, but like I requested in the scatter chart issue it would be nice to support other shapes.

markov00

I've done a quick check through the PR code and added few minor comments

I've found some weird issues when moving my mouse over multiple points
Seems that in some cases the number of datapoints in the tooltip is different from the number of elements highlighted (I can spot some duplicated values, like the bubbles 80 in this example)

src/scales/scale_band.ts

src/specs/settings.tsx

src/utils/geometry.ts

src/utils/themes/theme.ts

package.json

src/chart_types/xy_chart/utils/indexed_geometry_map.ts

src/chart_types/xy_chart/utils/series.ts

src/chart_types/xy_chart/utils/specs.ts

- Use linear index with area/line charts until tooltip re-design - Split stories into area/line with marks and bubble - Remove x value in tooltip when multiple values are present

- Fix type errors with mark chages - Random number generator logic - multiple x from source not positional value - Bring back error on band scales - Fix sorting function with string geo keys

- Cleanup yDomain tests with mocks - Cleanup stackedPercentSeries tests with mocks - Add isDefined and isDefinedFrom with tests - Make mark prop on RawDatum optional - Require datum on DataSeriesDatum - Update series mocks - Add rawDataSeries mock from data or data[] - Fix issue with null values in mergePartial

- Update mergePartial logic to treat Maps like Objects - Update mergePartial logic to treat Sets like Arrays - Add tests for new functionality

- Add Geometry mocks - Update Rendering bands tests with mocks

- Fix RecursivePartial for nested any, any[], Set and Map - Add option to mergeMaps, default is to replace.

… chart

- point tests - rendering area tests - rendering bubble tests - rendering line tests - general rendering tests - band and continuous scale tests

markov00

Code LGTM, great work on that!
Tested locally and works fine. I think we should address in the near future adding a more descriptive tooltip because is not very clear to me, what is X, Y, and radius value

nickofthyme · 2020-04-21T16:23:48Z

@markov00 I agree, we really need to update the tooltip to account for more cases.

# [18.4.0](v18.3.0...v18.4.0) (2020-04-22) ### Bug Fixes * **partition:** single slice wrong text positioning ([#643](#643)) ([6298d36](6298d36)), closes [#637](#637) * **treemap:** align onElementClick parameters to sunburst ([#636](#636)) ([2c1d224](2c1d224)), closes [#624](#624) ### Features * allow colorVariant option for series specific color styles ([#630](#630)) ([e5a206d](e5a206d)) * **series:** BubbleSeries (alpha) and markSizeAccessor ([#559](#559)) ([3aa235e](3aa235e))

markov00 · 2020-04-22T13:43:57Z

🎉 This PR is included in version 18.4.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

nickofthyme requested a review from markov00 February 19, 2020 18:28

nickofthyme force-pushed the master branch from b5d8489 to f3a05f1 Compare February 21, 2020 15:18

nickofthyme added the :vislib Relating to vislib replacement label Feb 24, 2020

markov00 force-pushed the master branch from c901523 to 6bf9a69 Compare March 2, 2020 18:53

nickofthyme force-pushed the feat/dot-accessor branch from b7b2db7 to 9f25616 Compare March 9, 2020 20:41

feat(series): dot accessor

1d937ce

nickofthyme force-pushed the feat/dot-accessor branch from 9f25616 to 1d937ce Compare March 31, 2020 16:11

nickofthyme changed the title ~~Add bubble chart (aka dot accessor)~~ feat(series): dot accessor Mar 31, 2020

refactor: tweak radius calculation

aa434d4

markov00 reviewed Apr 1, 2020

View reviewed changes

nickofthyme added 18 commits April 1, 2020 15:13

chore: add dot value to tooltip

627fe6e

refactor: cleanup

39f1066

- Use linear index with area/line charts until tooltip re-design - Split stories into area/line with marks and bubble - Remove x value in tooltip when multiple values are present

fix: dot labeling when value is null

aca819a

fix: remove unnecessary errors

46d8f17

refactor: rename dot to mark throughout

7bbeba8

fix: move delauney types to dev deps

cd88f07

refactor: check for markSizeAccessor before creating radius fn

d3f1e2b

fix: remove pow shorthand

b1d48ff

fix: linear map set method logic

7fc9950

refactor: change voronoi naming

b32a7e6

refactor: point geo check before spatial uppsert

8ff0c27

fix: various errors found in VRT

c2311a9

- Fix type errors with mark chages - Random number generator logic - multiple x from source not positional value - Bring back error on band scales - Fix sorting function with string geo keys

Merge branch 'master' into feat/dot-accessor

fab6300

fix: update snapshots with VRT changes

28ec199

fix: ts type errors and improve scale types

9063b3e

fix: update scale error handling

9f0b7ab

fix: type errors in unit tests

108d6a5

fix: update jest test snapshots

c638e14

markov00 changed the title ~~feat(series): markSizeAccessor and BubbleSeries~~ feat(series): markSizeAccessor and BubbleSeries (alpha) Apr 14, 2020

nickofthyme added 15 commits April 14, 2020 18:14

feat: mergePartial to allow Maps and Sets

c01ff6e

- Update mergePartial logic to treat Maps like Objects - Update mergePartial logic to treat Sets like Arrays - Add tests for new functionality

test: Rendering bands and geometry mocks

bce7d9f

- Add Geometry mocks - Update Rendering bands tests with mocks

feat: add option to mergePartial and fix type

e5d8a2c

- Fix RecursivePartial for nested any, any[], Set and Map - Add option to mergeMaps, default is to replace.

test: refactor rendering bars tests to use mocks

dc5ba80

fix: duplicate values in tooltip

7c2b6eb

fix: tooltip header visibility condition

460ea2e

fix: jest-extended matchers setup

824bd09

fix: ordinal values with BubbleSeries

5ee40ae

refactor: remove flatMap usage, fails in jest env

804e023

fix: prevent spatial index from returning values when point is out of…

dfa7cc1

… chart

test: add test coverage for changes

bf94125

- point tests - rendering area tests - rendering bubble tests - rendering line tests - general rendering tests - band and continuous scale tests

Merge branch 'master' into feat/dot-accessor

529d7e0

fix: tooltip header for bars, update screenshots

53ae456

fix: ordinal spatial selection

0b9d3ca

nickofthyme requested a review from markov00 April 16, 2020 23:07

nickofthyme added 4 commits April 17, 2020 09:22

fix: internal type error

8d54786

test: fix test to match new indexing logic

c46965b

chore: cleanup internal types and comments

ddcb014

Merge branch 'master' into feat/dot-accessor

6706665

markov00 approved these changes Apr 21, 2020

View reviewed changes

Merge branch 'master' into feat/dot-accessor

d3bdb4f

nickofthyme merged commit 3aa235e into elastic:master Apr 21, 2020

nickofthyme deleted the feat/dot-accessor branch April 21, 2020 17:24

markov00 added the released Issue released publicly label Apr 22, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(series): markSizeAccessor and BubbleSeries (alpha)#559

feat(series): markSizeAccessor and BubbleSeries (alpha)#559
nickofthyme merged 60 commits intoelastic:masterfrom
nickofthyme:feat/dot-accessor

nickofthyme commented Feb 19, 2020 •

edited

Loading

Uh oh!

wylieconlon commented Feb 20, 2020

Uh oh!

wylieconlon commented Feb 20, 2020

Uh oh!

markov00 left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

markov00 left a comment

Uh oh!

nickofthyme commented Apr 21, 2020

Uh oh!

markov00 commented Apr 22, 2020

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

nickofthyme commented Feb 19, 2020 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Bubble

Area

Line

Checklist

Uh oh!

wylieconlon commented Feb 20, 2020

Uh oh!

wylieconlon commented Feb 20, 2020

Uh oh!

markov00 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

markov00 left a comment

Choose a reason for hiding this comment

Uh oh!

nickofthyme commented Apr 21, 2020

Uh oh!

markov00 commented Apr 22, 2020

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

nickofthyme commented Feb 19, 2020 •

edited

Loading