D3.js 선택 상자가있는 막대 차트 축 레이블

Question

사용자가 거기에서 데이터를 변경할 수 있도록 축 레이블과 함께 드롭 다운을 추가해야합니다. 특정 레이블에만이 드롭 다운 상자 효과가 필요합니다.

우리가 시도한 한 가지 방법은 레이블이있는 svg : image를 추가하는 것이며 기능은 정상적으로 작동하지만 다른 레이블에는 필요하지 않은 아래쪽 화살표 이미지가 있습니다. 그래서 아무도 나를 선택할 수있는 방법을 하나 밖에 도울 수 없습니까? 사실 여러 개의 레이블이 있고 해당 인덱스는 차트 업데이트시 변경됩니다. 모든 라벨에 이미지를 추가하는 코드는 아래에서 찾으십시오.

g.selectAll('.nv-x.nv-axis').selectAll('.tick.major').append("svg:image"). 
on("click", click) 
.attr("xlink:href", "images/top-bar-logo.png") 
.attr("width", 20) 
.attr("height", 20).attr("x", -20); 

Answer 1

당신은 당신이 이미지를 추가 할 필요가 진드기를 선택 filter() function를 사용할 수 있습니다. 내가 링크 한 문서에는 몇 가지 예가 있습니다. selectAll()에 다른 선택기를 전달하여 filter()없이이 작업을 수행 할 수 있습니다.