Как в d3.js определить dropzone элемент?

Question

[Алексей Аристов]

var drag = d3.behavior.drag()
	.on("dragend", function(){
		console.log(this); // this — ссылка на перемещаемый элемент.
	});
d3.selectAll('li').call(drag);

Как определить элемент на котором случился drop?

Answer 1

[Ninja Mate]

ссылка на пример bl.ocks.org/thudfactor/6611441

Comments

[Ninja Mate]

aristov: а если по координатам определять?

var drag1 = d3.behavior.drag()
    .on("drag", dragmove)
    .on("dragend", function (a) { console.log('%o',a); });

    var g = d3.select("body").select("svg").append("g")
    .data([{ x: 50, y: 50 }]);

    g.append("rect")
    .attr("width", 40)
    .attr("height", 40)
    .attr("x", function (d) { return d.x; })
    .attr("y", function (d) { return d.y; })
    .call(drag1);

    function dragmove(d) {
        d3.select(this)
      .attr("x", d.x = d3.event.x)
      .attr("y", d.y = d3.event.y);
    }

[Алексей Аристов]

По координатам определить dropzone-element тоже получилось:

.on("dragend", function(){
		var e = d3.event.sourceEvent;
		this.style.visibility = 'hidden';
		console.log(document.elementFromPoint(e.clientX, e.clientY));
		this.style.visibility = 'visible';
	});

Answer 2

[Алексей Аристов]

var drag = d3.behavior.drag()
	.on("dragend", function(a) {
		console.log(d3.event.sourceEvent.explicitOriginalTarget);
	});

возвращает ссылку на html element.
Попробую, что получится в svg.

Comments

[Алексей Аристов]

Нет, получается не то, что требуется. Если перетаскиваемый объект находится под курсором мыши, то target-ы возвращают ссылку на перетаскиваемый объект, а не тот, куда случился drop.

[Ninja Mate]

aristov: вот тут интересно сделали bl.ocks.org/thudfactor/6611441

[Алексей Аристов]

Ninja Mate: в этом примере реализован примерно такой способ, как я ожидал. Спасибо за помощь!
Если не трудно, продублируйте, пожалуйста, свой комментарий в "ответы", чтобы я мог отметить его решением.