D3.js 캔버스 삭제

Question

D3을 사용하여 패밀리 트리 그래프를 생성하고 (여기에 제시된 코드를 기반으로 : http://www.d3noob.org/2014/01/tree-diagrams-in-d3js_11.html) 그래프 데이터가 서버에서 제공되며 사용자가보고자하는 패밀리를 선택할 수 있습니다. 데이터를 반환하는 제출 버튼을 클릭 한 다음 D3이 그래프를 그립니다. 그러나 사용자가 다른 패밀리 (또는 그 문제에 대해 동일한 패밀리)를 선택하고 페이지를 새로 고치지 않고 제출하면 새 그래프가 이전 패밀리 아래에 그려집니다. 새로운 그래프 만이 보이도록 D3.js 캔버스를 어떻게 지울 수 있습니까?

Answer 1

기존 선택에 .remove()을 적용하십시오. "( d3.select :

// Set new data on your chart: 
var items = d3.select('svg').selectAll('.item').data(newData); 

// Remove old elements: 
items.exit().remove(); 

Answer 2

특정 상황에서 위의 작품,하지만 난 캔버스을 취소 할 수있는 가장 쉬운 방법으로 컨테이너를 삭제, 용기에 아무것도 그리기 전에 그리는 것을 발견했다 #container ") .html (null);

Answer 3

그래프를 그리기 전에 다음 코드를 사용하십시오. 희망이 도움이 될 것입니다. JQuery와 빈 방법을 사용하여 컨테이너를 삭제, 컨테이너를 사용하는 경우

d3.select('svg').selectAll('*').remove(); 

Answer 4

내 문제 해결

$("#svgCanvasDiv").empty();