javascript - 为什么 `d` 没有在 d3.behavior.drag() 中定义

标签 javascript svg d3.js

我正在尝试制作一个可拖动的圆圈。

var drag = d3.behavior.drag();
  drag.on("drag", function(d,i) {
      console.log(d);
      d.x += d3.event.dx;
      d.y += d3.event.dy;
      //This will change the center coordinates by the delta
      d3.select(this).attr("x", d.x).attr("y", d.y);
      //This should change the upper left x and y values by the delta
      d3.select(this).attr("transform", function(d,i){
          return "translate(" + [ x,y ] + ")"
      })
  })

这是 fiddle

右边红色圆圈的每一步都会抛出错误,但为什么第 3、4、5 行会说 d is undefined?

最佳答案

工作 fiddle :http://jsfiddle.net/6a6da/33/

d,i 参数通常指的是绑定(bind)数据,但您并未绑定(bind)任何数据。在您的情况下,仅处理事件就足够了。

drag.on("drag", function() {
  d3.select(this).attr("cx", +d3.select(this).attr("cx") + d3.event.dx);
  d3.select(this).attr("cy", +d3.select(this).attr("cy") + d3.event.dy);
})l

关于javascript - 为什么 `d` 没有在 d3.behavior.drag() 中定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17244597/

相关文章:

javascript - 如何使用 puppeteer 访问文本输入字段中的当前值

javascript - 识别在 Firefox Addon SDK 中发出请求的选项卡

SVG 中的 CSS 属性命名空间选择器

css - 在我的网站中使用泰卢固语 ttf

javascript - 如何在 AngularJS 中以正确的方式在指令中使用 ng-repeat

javascript - 淡入淡出功能问题

css - 如何使用 css 为 svg 圆圈制作动画

javascript - Firefox event.clientX 无法运行

javascript - D3.js 边界框问题 - 强制勾选功能

javascript - d3 图表未正确更新