You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
functionCanvas({ configList }){letstageRef=React.useRef();functionhandleClick(){letoldScale=stageRef.current.scaleX();letnewScale=0.85;letpointer=stageRef.current.getPointerPosition();letmousePointTo={x: (pointer.x-stageRef.current.x())/oldScale,y: (pointer.y-stageRef.current.y())/oldScale};letnewPos={x: pointer.x-mousePointTo.x*newScale,y: pointer.y-mousePointTo.y*newScale};stageRef.current.scale({x: newScale,y: newScale});stageRef.current.position(newPos);}return(<Stageref={stageRef}onWheel={/* code to adjust scale based on 'manual' user interaction */}><Layer>{configList.map(config=><RectonClick={handleClick}{...config}/>)}</Layer></Stage>);}
Wanted to animate the stage properties to create a smooth zoom in transition when a user clicks on a Rect
but it turns out Stage isn't exported as part of animated i.e it's not listed in the primitives
Anyone know an alternative approach to make this work?
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
Wanted to animate the stage properties to create a smooth zoom in transition when a user clicks on a
Rect
but it turns out Stage isn't exported as part of
animated
i.e it's not listed in the primitivesAnyone know an alternative approach to make this work?
Beta Was this translation helpful? Give feedback.
All reactions