G6 icon indicating copy to clipboard operation
G6 copied to clipboard

To get REAL center in graph.zoom you need to use window.innerWidth and window.innerHeight NOT graph.getViewPortCenterPoint()

Open Radomir-Drukh opened this issue 1 year ago • 3 comments

Describe the bug

To get REAL center in graph.zoom you need to use window.innerWidth and window.innerHeight NOT graph.getViewPortCenterPoint()

graph.zoom(1.2, graph.getViewPortCenterPoint()) - WRONG

This call will zoom with move with offset

graph.zoom(1.2, {x: window.innerWidth / 2, y: window.innerHeight / 2} ) - CORRECT

This call will zoom right at the center.

Please state this fact in the documentation

Your Example Website or App

Steps to Reproduce the Bug or Issue

  1. Create graph that takes up only part of the screen
  2. Call graph.zoom(1.2, graph.getViewPortCenterPoint())

Expected behavior

As a user, I expected that graph.zoom(1.2, graph.getViewPortCenterPoint()) will zoom at the center of the camera view but i am seeing strange offset

Screenshots or Videos

No response

Platform

  • OS: macOS
  • Browser: Chrome

Additional context

No response

Radomir-Drukh avatar Oct 26 '23 21:10 Radomir-Drukh

hi @Radomir-Drukh, welcome!

github-actions[bot] avatar Oct 26 '23 21:10 github-actions[bot]

Hi @Radomir-Drukh, Please star this repo if you find it useful! Thanks :star:! 你好 @Radomir-Drukh。如果该仓库对你有用,可以 star 一下,感谢你的 :star:!

github-actions[bot] avatar Oct 26 '23 21:10 github-actions[bot]

The implementation of getViewPortCenterPoint is:

image

Which means the API returns the point in rendering coordinate system for the center of canvas DOM. If the graph has initial zoom (1) and not translation, the point of rendering coordinate system is equal to the center point of canvas DOM in number. But after zooming and translating (maybe caused by fitView, fitCenter, mouse wheel, etc.), they are different. Refer to the doc: https://g6.antv.antgroup.com/en/manual/advanced/coordinate-system , where the rendering coordinate system I mentioned before is the pointX/pointY coordinate system in the doc.

Yanyan-Wang avatar Nov 02 '23 09:11 Yanyan-Wang

This issue has been closed because it has been outdate for a long time. Please open a new issue if you still need help.

这个 issue 已经被关闭,因为 它已经过期很久了。 如果你仍然需要帮助,请创建一个新的 issue。

github-actions[bot] avatar Jul 05 '24 05:07 github-actions[bot]