Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

How to scale a Ruler component centered on the mouse pointer position #34

Open
xiaopujun opened this issue Nov 22, 2022 · 1 comment
Open
Labels
question Further information is requested

Comments

@xiaopujun
Copy link

Environments

  • Framework name: react, nodejs
  • Framework version:
  • Component name: Ruler
  • Component version:^0.12.2
  • Testable Address(optional):

Description

I perfected my designer with the Ruler component, and now I want to implement a mouse point as the center, scaling the canvas while scaling the Ruler component, when using the zoom property, the component does scale, but from the effect, the zoom center is in the upper left corner, not the coordinates of the mouse; I tried getting the ruler instance using the ref attribute and calling the TRANSLATE method of the canvas instance, but it failed because the ruler component doesn't seem to be a pure canvas object

@daybrush
Copy link
Owner

@xiaopujun

you can access canvasElement property.

ref={rulerRef}
rulerRef.current.canvasElement // HTMLCanvasElement

@daybrush daybrush added the question Further information is requested label Nov 23, 2022
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants