클릭했을 때 원의 크기를 조정하려면 어떻게해야합니까?

Question

저는 D3을 처음 접했고 그 중 하나를 클릭하면 모든 서클의 크기를 조정하는 방법을 알아 냈습니다. 그러나 내가 원하는 것은 클릭 한 원의 크기 만 조절하는 것입니다. 나머지 서클은 동일하게 유지되어야합니다.

HTML :

<g id="bubble-nodes"> 
    <rect id="bubble-background"></rect> 
    <a class="class="bubble-node"> 
     <circle r="65"></circle> 
    </a> 
    .... 
</g> 

자바 스크립트/D3 :

// this works. It allows me to resize all circles when I click on one of them. 
// but, it's not what I want 
var resizeCircle = function() { 
    var circle = d3.selectAll('circle'); 
    circle.attr("r", 85); 
}; 

// this is what I want, but it doesn't work. 
// I want to resize the circle I clicked on 
var circle = d3 
    .selectAll('circle') 
    .on("click", function (d) { 
     return d.attr("r", 85); 
    }); 

어떤 제안을 여기에 내가 가진 무엇인가?

Answer 1

이 정보가 도움이 되나요?

var circle = d3 
    .selectAll('circle') 
    .on('click', function (d) { 
     d3.select(this).attr("r", 85); 
    });