d3.js 새 데이터 트리 맵핑이 렌더링되지 않음

이것이 내 첫 번째 시도 인 d3.js이며 트리 맵을 다시 그리는 방법을 알 수 없습니다. json 요청을 사용하여 treemap example에 새로운 데이터를로드하려고합니다. 내 treemap.js에 다음 코드를 추가했습니다.d3.js 새 데이터 트리 맵핑이 렌더링되지 않음

d3.select(".search_field").on("click", function(){ 
    d3.json("/applications.json?search=Applejuice", function(json) { 
     div.data([json]).selectAll("div") 
      .data(treemap.nodes) 
      .enter().append("div") 
      .attr("class", "cell") 
      .style("background", function(d) { return d.children ? color(d.name) : null; }) 
      .transition() 
      .duration(1500) 
      .call(cell); 
    }); 
});

요청이 완료되고 데이터가 개체에 올바르게로드 된 후 var div를 검사했습니다.

출처

2012-03-27 MikeV

기존 요소를 업데이트하는 대신 새 요소를 추가하고 있습니다. 라인

.enter().append("div")

이을 담당하고 기존 데이터를 업데이트 할 경우 삭제해야합니다. 을 .data() 다음에 호출하면 더 이상 존재하지 않는 데이터 인 .exit()이 이전에 없었던 데이터를 제공합니다. 이전 데이터와 새 데이터가 올바르게 병합되지 않은 경우 .data()에 두 번째 인수 (선택 사항)를 사용하여 병합 기능을 제공 할 수 있습니다.

출처

2012-03-27 17:34:09

Lars, 답장을 보내 주셔서 감사합니다. .enter(). append ("div")를 제거하면 도움이되었지만 treemap.sticky (true)를 추가해야했습니다. div.data 섹션 앞에. 감사! – MikeV

너무 빨리 말한 것 같습니다. 매우 비슷한 값을 가진 데이터를로드하려고하면 다음과 같은 동작이 발생합니다 [screencast] (http://www.screencast.com/t/bmHTYNGXx). 나는 완전히 .enter() .exit() 호출을 따르지 않았다. – MikeV

내가 말했듯이, 당신은'.data()'에 선택적 함수 인수를 사용하고 ID 나 그와 비슷한 것을 병합해야 할 수도 있습니다. –

d3.js 새 데이터 트리 맵핑이 렌더링되지 않음

답변

관련 문제