D3.js D3v6拖动事件回调函数使用未定义的参数激发

在D3v6文档之后，我无法在使用d3.symbol util绘制的path SVG元素上实现简单的拖动行为。typescript类在这里显示为上下文。 事件在正确的元素上触发，但回调函数似乎没有接收事件、数据参数。 任何帮助都将不胜感激

从d3导入*作为d3； 导出默认类滑块{ svg:SVGSVGElement； 构造器VG:SVGSVGElement{ this.svg=svg； } 画{ const g=d3.selectthis.svg.append'g.attr'class'，symbol'； 常数圆=g.append'circle'.attr'r'，200； const D=d3.drag/`event`和`D`在下面的3行中始终未定义 .onstart，事件，d=>circle.attrstrow，lime .ondrag，event，d:any=>d.x=event.x，d.y=event.y .onend，event，d=>circle.attrstrow，黑色；//无法确定正确的类型 circle.callD； } }

---

回答我自己的一些细节。 剥离任何网页包/打字脚本业务， 在单个html文件中，定义了拖动事件回调参数

常量svg=d3。选择“数据”。追加“svg”。属性“宽度”，500。属性“高度”，500； console.logsvg； const circle=svg.append'circle.attr'r'，5.attr'cy'，25.attr'cx'，25； //已定义`event`参数 常数D=d3.0 .onstart，事件，d=>circle.attrstrow，lime .ondrag，事件，d=>{ console.logevent； } .onend，事件，d=>circle.attrstrow，黑色； circle.callD；

---

但这并不能解决我最初的问题。

问题的一个可能原因是第一个示例中使用的d3版本不是v6.0。从v5.x到v6.0发生了重大变化

您的代码是v6.0样式的，因此它在第二个示例中工作，在该示例中它显式地从导入v6.0

您可以确认原始代码是否运行d3 v6.0，其中一个回调中有一个console.logd3.event：

.ondrag，=>{ console.logd3.event； } 如果上面的代码记录了事件，则表示您的d3版本为v5.x。 如果它可以工作，但typescript也会给出一个类型错误，这意味着您的typings@types/d3是针对v6.0的，因此它们与安装的d3版本不一致

在任何情况下，如果d3.event有效，那么最简单的解决方案就是将d3更新为v6.0，因为您已经拥有与最新版本兼容的代码

回调的第二个参数是绑定到元素的数据。在您的示例中，它应该是未定义的，因为没有与圆关联的基准面，即没有。selectAll…data。。。在.append之前。如果有兴趣，你可以查一下，以便更好地理解它

因此，v5.0中没有数据绑定的最小阻力行为示例如下：

.ondrag，函数{ d3.选择this.attrcx，d3.event.x.attrcy，d3.event.y； } 在v6.0中：

.ondrag，functionevent{ d3.选择this.attracx、event.x.attracy、event.y； }

---

节点：记住使用function关键字而不是arrow函数=>

谢谢你的提示。原来我的设置使用的是d3v6打字，但可能安装了d3v5.X模块。npm install d3@^6将事情弄清楚，现在已定义事件和d参数。