(이 경우 확대의 목적을 위해)

Question

나는 마이크의 클릭 줌 - 예와 유사 지역으로 확대지도를 구현하고 싶습니다 http://bl.ocks.org/mbostock/2206590

사실 이미 잘 작동합니다. 내 문제는 내가 클릭 이벤트에 의존하여 확대/축소를 구현할 수 없다는 것입니다. 확대/축소는 다른 이벤트 (링크)에 의해 트리거됩니다. 마이크 코드의이 부분에 도달했을 때 :

function clicked(d) { 
var x, y, k; 

if (d && centered !== d) { 
var centroid = path.centroid(d); 
... 

나는 'd'가 없기 때문에 약간의 손실이 있습니다. 그래서 저는 대신 제가 전화 할 때 수동으로 'd'를 클릭 기능에 전달할 수 있다고 가정합니다. 그러나 실제로지도에서 원하는 기능을 실제로 선택하려면 어떻게해야합니까?

좀 더 구체적으로 말해서 나는 세계의지도를 가지고 있습니다. SVG 그룹 내의 경로 (예를 들어 프랑스의 한 모양) 클래스 정보가 포함

<path class="subunit FXX FRA" id="FXX" data-subunit="FXX" data-countryName="France" data-countryCode="FRA" d="M153.88838704622088,519........"></path> 

가 어떻게 클릭 된 (D) 함수에 '프랑스의 객체를'통과 할 것인가? 아니면 제가 시도해야 할 또 다른 접근법이 있습니다.

모든 도움말이나 도움을 주시면 감사하겠습니다.

Answer 1

프랑스 객체와 연관된 데이터 가져 오기 :

d3.select('.FXX.FRA').datum() 

을 그리고 클릭에 전달 :

clicked(d3.select('.FXX.FRA').datum()) 

Answer 2

당신은이 목적을 위해 D3의 선택을 사용할 수 있습니다

:

d3.select(".FRA").each(function(d) { 
    // same code as inside clicked 
});