요소의 텍스트 내용을 기반으로하는 필터

Question

저는 d3에 상당히 익숙하며 Mike Bostock의 Treemap 예 (http://bl.ocks.org/mbostock/4063582)를 조정하려고합니다. 다음은 내가 달성하기를 원하는 것입니다 :

1) 제출 버튼을 통해 사용자로부터 텍스트 입력을받습니다.

2) 텍스트 입력을 포함하는 노드를 찾습니다 (트리에서).

3) 노드의 배경 속성을 변경하십시오.

질문을 더 간단하게 만들려면 요소의 텍스트 콘텐츠를 기반으로 요소를 필터링 (하위 집합) 할 수있는 방법이 있습니까?

예를 들어, 다음과 같은 네 개의 p 요소가있는 경우 다음과 같이 Cathy라는 이름을 빨간색으로 바꿀 수 있습니까?

<p>Alice</p> 
<p>Ben</p> 
<p>Cathy</p> 
<p>Daniel</p> 

대한 의견

d3.selectAll("p") 
    .filter(function(d) { return d.text === Cathy; }) 
    .attr("color", "red"); 

는 이해할 수있을 것이다.

Answer 1

텍스트를 설정하는 데 사용 된 "text"요소를 포함하여 기존 요소에 이미 데이터가 바인딩되어있는 경우 예제 코드가 곧바로 작동합니다 ("Cathy"문자열 제외).

d3.selectAll("p") 
    .filter(function(d) { return d3.select(this).text() === "Cathy"; }) 
    .attr("color", "red");