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

new(xychart): add (EventEmitter, Tooltip)Context + basic Tooltips #825

Merged
merged 10 commits into from
Oct 5, 2020

Conversation

williaster
Copy link
Collaborator

@williaster williaster commented Oct 1, 2020

TODO

🚀 Enhancements

This PR adds event + tooltip layers to the xychart package, and updates the demo to use them. These layers were largely coupled in the XYChart proof-of-concept (#745) but I think it's cleaner to separate the two so that different events (brush, pan, zoom) can be supported later.

The event emitter context layer is implemented based loosely on the proof-of-concept discussed in #761 (see sandbox), and the tooltip context mostly mirrors the useTooltip functionality but provided in context instead of a hook.

To explain how everything fits together I made this

Demo

Future work



  • support crosshair
  • support snapping to data points (x,y)
    • should Series handle this or should Tooltip?

      • ❌ would have to set per Series if it handled it 

      • ❌ if Tooltip-level prop, it needs to know which datum to choose
  • limitation: don’t know closest datum
    • figure out if we need to merge data based on distance in tooltipData

@kristw @hshoff @techniq

@coveralls
Copy link

coveralls commented Oct 1, 2020

Pull Request Test Coverage Report for Build 85

  • 82 of 96 (85.42%) changed or added relevant lines in 13 files are covered.
  • 1 unchanged line in 1 file lost coverage.
  • Overall coverage increased (+1.3%) to 56.545%

Changes Missing Coverage Covered Lines Changed/Added Lines %
packages/visx-xychart/src/components/XYChart.tsx 9 11 81.82%
packages/visx-xychart/src/utils/findNearestDatumSingleDimension.ts 23 25 92.0%
packages/visx-xychart/src/components/series/BarSeries.tsx 6 11 54.55%
packages/visx-xychart/src/components/series/LineSeries.tsx 5 10 50.0%
Files with Coverage Reduction New Missed Lines %
packages/visx-pattern/src/patterns/Lines.tsx 1 85.0%
Totals Coverage Status
Change from base Build 283122090: 1.3%
Covered Lines: 1241
Relevant Lines: 2119

💛 - Coveralls

Copy link
Collaborator

@kristw kristw left a comment

Choose a reason for hiding this comment

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

LGTM from the gif. just minor comments about naming. Wish we have preview build.

emitter.on<HandlerParams>(eventType, handler);
return () => emitter?.off<HandlerParams>(eventType, handler);
}
return undefined;
Copy link
Collaborator

Choose a reason for hiding this comment

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

not necessary to return undefined?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I get lint errors if I return nothing (not all paths return a value) and undefined was the only non-function return value allowed by TS

Copy link
Collaborator

Choose a reason for hiding this comment

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

oh right. ignore my comment then

packages/visx-xychart/src/utils/findNearestDatumX.ts Outdated Show resolved Hide resolved
@williaster williaster changed the base branch from chris--xychart-bar-series to master October 1, 2020 21:12
* test(xychart): organize test/ into subfolders that mirror src/

* test(xychart): add EventEmitterProvider + TooltipProvider tests

* test(xychart): add Tooltip test, add UseTooltipPortalOptions props

* test(xychart): add useEventEmitter tests

* test(xychart): add findNearestDatum tests

* fix(xychart): test + type fixes
@williaster williaster merged commit 4b08bcf into master Oct 5, 2020
@williaster williaster deleted the chris--xychart-events branch October 5, 2020 18:51
@williaster williaster added this to the 1.1.0 milestone Oct 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants