지형지 물을 선택한 경우 테이블에 데이터 표시

Question

안녕하세요. Phil Pedruco의 http://bl.ocks.org/phil-pedruco/7557092은 내 질문에 대한 답입니다. 나는 아일랜드 군 중 하나와 같은 지리적 위치를 클릭하는 방법에 대해 궁금해서 테이블의 적절한 행을 강조 표시했습니다. 카운티 정보가 표시된 행이 하나 이상 있어야합니다. 어떤 도움을 주셔서 감사합니다 - 사랑스러운 작품.

Answer 1

d3.csv 콜백 외부

첫 번째 테이크 행 선언 우리는 클릭 기능에 대한 액세스를 필요로 :

var g = svg.append("g"), rows; 

가 표시됩니다 표시하는 행에

설정 활성 클래스 :

// create a row for each object in the data 
      rows = tbody.selectAll("tr") 
        .data(data) 
        .enter() 
        .append("tr") 
        .attr('class', 'active'); 

클릭 기능을 사용하면 모든 행에서 활성 클래스를 제거하고 선택된 카운티에 해당하는 행을 가져와 활성 클래스를 설정할 수 있습니다.

d3.selectAll('tr.active').classed('active', false); 
     rows.filter(function(r){ 
      return r.County === d.properties.name; 
     }) 
     .attr('class', 'active'); 

리셋에

그들을 볼 수 있도록 모든 행에 다시 활성 클래스를 추가 할 수 있습니다 : http://bl.ocks.org/ckothari/96248a1cf4efff934600c1d1f1e6d9b4