箭头函数返回值书写错误导致的bug

​ 首先,_plotPolygons 方法中的 polygon-label 类的文本位置是根据 _zx_zy 这两个缩放后的比例尺计算得到的。这意味着如果这些比例尺没有正确更新或者在缩放时没有被正确使用,那么标签的位置就会出错。

zoomed 函数中,你可以看到对于诸如 circle, .linestring-path, .polygon-path 的缩放处理是通过更新属性 cx, cy, d 来实现的。但是对于 text.polygon-label 的处理,似乎有些不一致:

js 复制代码
.attr('x', (d) => {zx(d.data[0] ? d.data[0] : d[0])})
.attr('y', (d) => {zy(d.data[1] ? d.data[1] : d[1])});

在上述代码中,xy 属性的设置函数中使用了 {} 而不是直接返回计算结果,这将导致函数没有实际返回任何值,因此 xy 属性并未被正确设置。

正确的写法应该直接返回计算结果,例如:

js 复制代码
.attr('x', (d) => zx(d.data[0] ? d.data[0] : d[0]))
.attr('y', (d) => zy(d.data[1] ? d.data[1] : d[1]));

同时,请确保 d.data[0]d.data[1] 正确指向了标签应该位于的坐标点。假设 d.data 是一个包含两个元素的数组,其中第一个元素是 x 坐标,第二个元素是 y 坐标。

最后,确保 _zx_zyzoomed 函数调用之前已经正确地被更新。如果这些比例尺在缩放事件发生时没有更新,那么标签的位置也会出错。

总结一下,解决位置错误的问题可能需要以下几个步骤:

  1. 确保在 zoomed 函数中正确更新 polygon-labelxy 属性。
  2. 检查 d.data 是否正确地代表了标签的坐标。
  3. 确保 _zx_zy 在缩放事件发生时被正确更新。
相关推荐
吠品16 分钟前
Vue项目Moment.js引入优化:全局挂载与按需引入的深度解析与最佳实践
前端·javascript·vue.js
不甜情歌18 分钟前
JS 类型判断不用愁:4 种方法,覆盖所有场景
前端·javascript
ETA825 分钟前
状态管理没那么复杂:手写实现 Zustand 核心逻辑
前端·react.js
万粉变现经纪人27 分钟前
如何解决 pip install shapely 报错 GEOS C 库未找到 问题
c语言·开发语言·python·pycharm·bug·pandas·pip
用户2557788508131 分钟前
axios请求缓存
前端
夫瑞32 分钟前
TypeScript 直接编译成原生二进制,没有浏览器,没有 V8
前端
Talents33 分钟前
OpenLayers 7.5.2 判断点是否在区域边上
前端
cmd36 分钟前
前端基础必看:JS 变量提升 & 函数提升完整解析
前端·javascript
小金鱼Y36 分钟前
前端必看:this 不是玄学!5 大绑定规则帮你永久告别 this 困惑
前端·javascript·面试
谁在黄金彼岸36 分钟前
用 AI 设计力打造专业 UI/UX:在 Trea、Qoder 等 AI IDE 中集成 ui-ux-pro-max-skill
前端