react-vis icon indicating copy to clipboard operation
react-vis copied to clipboard

Create ZoomHandler

Open Xiot opened this issue 4 years ago • 3 comments

Due to the way that the Highlight component handles the mouse events, it is pretty much required that it is one of the last children of the XYPlot. Since it renders a transparent rect over the entire XYPlot it currently disables any mouse events for controls lower in the dom tree. If the Highlight component is moved higher in the dom tree, then the onMouseLeave event will fire when a lower component is hovered over.

The ZoomHandler delegates the handling of the mouse events to the XYPlot itself. The XYPlot now holds a collection of Event objects that will be passed to the children, where they can subscribe to the ones that they are interested in. When the appropriate Event in the XYPlot is fired, it will execute the callbacks for all listeners. This approach does not cause the XYPlot to re-render, and only the listeners that perform an operation in their callback will be re-rendered.

Also created a useStateWithGet that wraps a useState call and also provides a memoized getState method. Since the getState method is only created once for the component, it will not trigger re-renders when listed in the dependencies of useEffect / useCallback. This drastically cuts down the number of event handlers that are subscribed / unsubscribed.

Xiot avatar Jun 10 '20 21:06 Xiot

Any ideas on a better name for ZoomHandler ?

Xiot avatar Jun 11 '20 01:06 Xiot

I am not the greatest to find names, I think ZoomHandler is fine!

reitlepax avatar Jun 11 '20 08:06 reitlepax

Converting this back to a draft as I want to change up the api a bit. The zoom handler doesn't actually zoom anything... it just handles the selection I'm going to change it to just handle the selection, and I'll make a separate component for the draggable window that Highlight has (although this may be in a separate PR)

Xiot avatar Jun 11 '20 16:06 Xiot

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.


Chris Thomas seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.
You have signed the CLA already but the status is still pending? Let us recheck it.

CLAassistant avatar Apr 07 '22 12:04 CLAassistant