如何在drag.start和drag.end之间传递d3值

Question

我无法让d.startX和d.startY在.end()块中显示值(它们是未定义的)。有什么好主意吗？

    .call(d3.drag().on("start", function(d) {
        let coords = d3.pointer(event);
        let xPos = coords[0]
        let yPos = coords[1]
        d.startX = xPos
        d.startY = yPos
    }).on("end", function(d) {
        let coords2 = d3.pointer(event);
        let xPos2 = coords2[0]
        let yPos2 = coords2[1]
        console.log(d.startX) //shows up as undefined
        console.log(xPos2)
        console.log(yPos2)

Answer 1

您可以在"this“引用中为当前事件设置任何值(例如，'start‘事件)。在相应的"end“函数中，您可以获取您的值。

.call(d3.drag().on("start", function(d) {
  let coords = d3.pointer(event);
  let xPos = coords[0]
  let yPos = coords[1]
  d.startX = xPos
  d.startY = yPos
  this._current = d;
}).on("end", function(d) {
  let coords2 = d3.pointer(event);
  let xPos2 = coords2[0]
  let yPos2 = coords2[1]
  console.log(this._current.startX) //Must show the value
  console.log(xPos2)
  console.log(yPos2)`