저는이 Voronoi 다이어그램 ( http://bl.ocks.org/christophermanning/1734663 ) 을 사용하려고했고 제가하고 싶었던 것은 각 노드에 대해 임의의 움직임을 추가하여 다이어그램에서 일정한 움직임을 갖도록하는 것입니다.
이를 위해 임의의 순간에 임의 노드의 위치로 변경하는이 코드를 추가했습니다.
setInterval(function(){
vertices.forEach(function(d, i) {
if (Math.random() < 0.05) {
setTimeout(function() {
angle = radius * (i+10);
vertices[i].x = vertices[i].x * (1 + Math.random() / 20 * randomZ());
vertices[i].y = vertices[i].y * (1 + Math.random() / 20 * randomZ());
}, Math.random() * 1000);
}
});
}, 1000);
function randomZ() {
return (Math.random() > 0.5) ? 1 : -1;
};
코드는 잘 작동하지만 몇 초 후에 화면이 멈추고 더 이상 아무것도 움직이지 않습니다 (적어도 크롬에서는). 나는 동시에 많은 계산을하고 있다고 생각합니다.
이 문제를 해결할 방법이 있습니까?
여기에 JSFiddle이 있습니다. http://jsfiddle.net/7krkh/1/
이 동작이 나타나는 이유 tick는 디스플레이를 업데이트하기 위해 force 레이아웃의 이벤트를 사용하고 있기 때문 입니다. 루프는 데이터 만 수정합니다. 강제 레이아웃은 force.stop()명시 적으로 호출하지 않더라도 잠시 후 냉각되고 중지 됩니다. tick그 이후에는 더 이상 이벤트가 생성 되지 않습니다 . 이는 귀하의 경우 기본 데이터가 계속 변경되지만 디스플레이가 더 이상 업데이트되지 않음을 의미합니다.
쉬운 수정은 setInterval데이터를 변경하는 루프 (또는 오히려) 의 각 반복에서 강제 레이아웃을 다시 시작하는 것입니다.
setInterval(function(){
// ...
force.start();
}, 1000);
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다