Cuando hago clic en un rectángulo, se crean puntos suspensivos. En arrastre quiero hacer algo. El problema es que necesito los datos (d) del rectángulo en el que hice clic, también en mis funciones de arrastre, connectStart, connectDrag y connectEnd. En las últimas 3 líneas, traté de agregar datos a mi Ellipse, para acceder a d desde estas 3 funciones, pero en las funciones de arrastre, d es siempre el primer valor de mis propios datos y no la d del rect en el que hice clic. Así que no está funcionando. Cuando eliminé por completo las últimas 3 líneas, obtengo 'd no definido' en mis funciones de arrastre. ¿Cómo puedo hacer esto?

 drawLine = d3.drag() .on('start', connectStart) .on('drag', connectDrag) .on('end', connectEnd); ... rects = itemRects.selectAll('rect') .data(self.data) .attr('x', function (d) { return newXscale(d.start); }) .attr('y', function (d) { return yScale(d.lane) + ((getMarginHeight() / (self.lanesLength || 1)) * 0.2); }) .attr('width', function (d) { return (newXscale(d.end) - newXscale(d.start)); }) .attr('height', itemHeight) .attr('rx', 10) .attr('ry', 10) .attr('class', function (d) { return d.class + ' main'; }) .attr('id', function (d) { return 'rect_' + d.id; }) .attr('opacity', 0.5) .attr('fill', '#0091dc') .call(drag) .on('click', function (i, d) { console.log('PARENTNODE', this.parentNode); console.log('Node', this); d3.selectAll('g > ellipse').remove(); d3.select(this) .attr('class', function (d) { return d.class + ' task-selected'; }) .attr('stroke-width', '3') .attr('stroke', '#000088'); d3.select(this.parentNode) .append('ellipse') .attr('cx', newXscale(d.end) + 1) .attr('cy', yScale(d.lane + d.lane + 1) / 2) .attr('rx', 3) .attr('ry', 6) .attr('stroke-width', '2') .attr('stroke', '#0091dc') .attr('fill', '#0091dc') .attr('class', 'dependencieStart') .attr('opacity', '1'); d3.selectAll('ellipse.dependencieStart') .data(self.data) .call(drawLine); ...