获取被拖动的 SVG 元素的 id

Question

我正在使用 svg.js 和 dragg.js 来移动一系列动态创建的对象（矩形和圆形等）。 他们都在一个名为nodes 的组中，我可以获得被拖动项目的位置，但我在尝试检索时迷失了

gid="dyanmicidIcreated"

我需要这个来识别哪个 SVG 对象被移动了？

nodes.mouseup(node => {
  console.log("x: "+node.clientX)
  console.log("y: "+node.clientY)
})

Answer 1

您将处理程序传递给使用触发的事件调用的函数。 因此，有关事件的所有信息都在事件对象中（出于某种原因，您将其称为 node）。

nodes.mouseup((event) => {
    // mouse coordinates
    console.log(event.clientX, event.clientY)

    // the node which was clicked
    console.log(event.target)

    // the svgjs object
    console.log(SVG.adopt(event.target))

    // the id
    console.log(SVG.adopt(event.target).id())
})

如果不使用箭头函数，函数会在 svgjs 对象的范围内调用。所以你可以使用this:

nodes.mouseup(function (event) {
    // `this` is same as node
    console.log(this)

    // id
    console.log(this.id())
})

在 svg.js v3.0 中，您将使用 SVG(event.target) 而不是 SVG.adopt。其他一切都保持不变

Answer 2

console.log(SVG.adopt(event.target.parentNode).id())