解决minimap在图形长宽比和容器差异大时,缩略图跳转计算错误 - #5083
Conversation
比如图形长宽比1:10000,缩略图点击跳转错误
There was a problem hiding this comment.
Code Review
This pull request refactors the scrollTo method in the MiniMap plugin to use pageX/pageY offsets relative to the target graph's container, avoiding coordinate inconsistencies caused by internal child elements. It also replaces the static this.ratio with the dynamic scale from this.targetGraph.transform.getScale() to fix coordinate deviations in non-scroller mode. The reviewer suggested adding defensive checks for Dom.offset to prevent potential runtime errors, handling potential division by zero or NaN for the scale factors, and updating the doAction method similarly to maintain consistency.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
| const containerOffset = Dom.offset(this.targetGraph.container) | ||
| const x = e.pageX - containerOffset.left | ||
| const y = e.pageY - containerOffset.top |
There was a problem hiding this comment.
改进建议:
Dom.offset 在某些极端情况下(例如元素未挂载、处于测试环境或 DOM 结构异常时)可能会返回 null 或 undefined。如果直接访问其属性可能会导致运行时报错 TypeError: Cannot read properties of null。
建议进行防御性处理,为 containerOffset 提供一个默认值,例如 || { left: 0, top: 0 },以增强代码的健壮性。
| const containerOffset = Dom.offset(this.targetGraph.container) | |
| const x = e.pageX - containerOffset.left | |
| const y = e.pageY - containerOffset.top | |
| const containerOffset = Dom.offset(this.targetGraph.container) || { left: 0, top: 0 } | |
| const x = e.pageX - containerOffset.left | |
| const y = e.pageY - containerOffset.top |
| const targetScale = this.targetGraph.transform.getScale() | ||
|
|
||
| const cx = (x - ts.tx) / this.ratio | ||
| const cy = (y - ts.ty) / this.ratio | ||
| const cx = (x - ts.tx) / targetScale.sx | ||
| const cy = (y - ts.ty) / targetScale.sy |
There was a problem hiding this comment.
改进建议:
- 除零/NaN 防御:在极端情况下(例如容器尺寸为 0、缩放比例异常或处于某些过渡动画中),
targetScale.sx或targetScale.sy可能会为0或NaN。直接作为除数会导致计算结果为Infinity或NaN,从而使centerPoint计算失效。建议对它们进行防御性处理,若为 0 或无效值,则回退到this.ratio或1。 doAction中的一致性问题:虽然本次修改解决了scrollTo(点击跳转)中的缩放比不一致问题,但在doAction方法(处理拖拽平移,约第 274-280 行)中,依然在使用this.ratio进行坐标转换。在非 scroller 模式下,这同样会导致拖拽视口时出现偏差(拖拽速度与鼠标不贴合)。建议在后续重构或同一 PR 中,将doAction中的this.ratio也替换为targetScale.sx和targetScale.sy,以保持逻辑的一致性。
const targetScale = this.targetGraph.transform.getScale()
const sx = targetScale.sx || this.ratio || 1
const sy = targetScale.sy || this.ratio || 1
const cx = (x - ts.tx) / sx
const cy = (y - ts.ty) / sy
比如图形长宽比1:10000,缩略图点击跳转错误
📝 Description
🖼️ Screenshot
💡 Motivation and Context
🧩 Types of changes
🔍 Self Check before Merge