모든 원 엘리먼트에 보냄 beleviour

Question

모든 원 요소를 가져 와서 클릭 할 수있게하는 함수를 만들어야합니다. 내 코드를 사용하면 내가 만든 마지막 노드 만 클릭 할 수 있으며 이유를 이해할 수 없습니다. 도와 줄수있으세요? d3 라이브러리를 사용합니다. 내 코드는 다음과 같습니다.

var allCircles = vis.selectAll('circle'); 

allCircles.on('click', function(){ 
    /* make the same stuff depending from the circle clicked */ 
}); 

자세한 설명이 필요하면 제게 문의하십시오.

저를 도와 주셔서 감사합니다!`

Answer 1

을 나는 D3 라이브러리를 사용하지 않고 내가 들어 본 적이없는하지만 난 그게 도움이되기를 바랍니다

var circles=document.getElementsByTagName('circle'); 
function onclik() { 
    //do stuff 
} 
for(var i=0;i<circles.length;i++){ 
    circles[i].setAttribute("onclick","onclik()") 
} 

없이 그것을 할 수 있습니다 !

Answer 2

대신 원의 (상위) 컨테이너 요소에 이벤트 수신기를 추가하는 것이 좋습니다. 이는 수신기와 같은 요소가 있음을 의미합니다 (예 : <g>).

var circleContainer = /* find your g element that contains the circles here */; 

circleContainer.on('click', function(){ 
    // d3.event.target is the clicked circle 
    d3.select(d3.event.target).attr("fill", "blue"); 
}); 

jQuery에 대해 더 잘 알고 있다면 개념은 'delegated events'입니다.