FormidableLabs / FormidableLabs/victory

Investigate calculating data intersections in `VictoryCursorContainer`

Open
#1,122 1 comment 0 reactions 0 assignees View on GitHub
Issue: Accepted Type: Enhancement :pencil2:
Dominant language
TypeScript
Stars
11.2k
Forks
536
PR merge metrics
No merged PRs in 30d

Description

So that folks can put a marker on a line and have it smoothly follow the cursor. Currently the process is v. complex

From the gitter channel:

> You will need to make a little wrapped line and provide it to `VictoryCursorContainer` via the `cursorComponent` prop. You will inspect the props coming into it, and alter the `y1` so that it cuts off early. You can use the `onCursorChange` callback prop to calculate what the new `y1` prop should be. This callback will be called with the value of the cursor in terms of data as the first argument, and the rest of `VictoryCursorContainer`'s props (including `scale`) as the second argument. Unfortunately, `VictoryCursorContainer` doesn't calculate any intersections with your data, so you will have to do some math on your data array to get the the value of the data intersection You can use something like https://github.com/d3/d3-array#bisectLeft. You will then use the `scale prop` to convert that value to an svg coordinate and use that as your `y1`. Phew. That's a lot! I will open an issue to investigate the the complications / performance impact of calculating the intersection in VictoryCursorContainer

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.