For some background; I want to create a web app in react, which displays a graph inside a frame. Whenever the user swipes inside that frame (using the mouse on a computer or finger on mobile), in a certain direction, the graph will respond and move.

Imagine a bell curve which gets wider/less wide as you swipe downwards/upwards within the frame that displays the curve, as an example.

I have created something similar within iOS. Then I used a UIGestureRecognizer and applied it to a graphview, which then executed a function whenever the user swiped within the graphview, which reloaded the graphview with a different dataset.

How would I go about creating this in react for my web app?