[D3] d3-force Force simulations 사용법

d3.forceSimulation(nodes)

nodes 배열을 사용하고 forces를 사용하지 않고 새 시뮬레이션을 만듭니다. nodes배열은 객체를 담고 있는 배열입니다.

시뮬레이션이 만들어지면 객체 안에 vx,vy,x,y,index가 만들어집니다. 시뮬레이션은 자동으로 실행됩니다. 실행되는 동안 이벤트를 수신하려면 Simulation.on을 사용하면 됩니다. 수동으로 실행할려면 Simulation.stop을 호출한 다음 Simulation.tick을 호출하면 됩니다.

const nodes = [
	{name: 1},
    {name: 2},
    {name: 3},
    {name: 4},
    {name: 5}
]

const simulation = d3.forceSimulation(nodes)

simulation.restart()

시뮬레이션의 내부 타이머를 다시 시작하고 시뮬레이션을 반환합니다. simulation.alphaTarget 또는 simulation.alpha를 사용하여 상호 작용을 보여줄 수 있습니다.

simulation.stop()

시뮬레이션의 내부 타이머를 중지하고 시뮬레이션을 반환합니다. 

simultaion.tick(iterations)

지정된 반복 횟수만큼 시뮬레이션을 수동으로 진행합니다. 반복이 지정되지 않은 경우 1입니다.

simulation.nodes(nodes)

노드가 지정되면 시뮬레이션의 노드를 지정된 nodes로 설정하고 필요한 경우 위치와 속도를 초기화합니다.

vx, vy의 속도가 NaN이면 속도는 0,0으로 초기화됩니다. x, y가 NaN인 경우 phyllotaxis arrangement에서 균일한 분포를 보장하도록 선택됩니다. fx, fy를 추가 속성으로 지정하여 노드를 고정할 수 있습니다.

simulation.alpha(alpha)

시뮬레이션이 시간이 지남에 따라서 alpha값이 감소합니다. alpha값이 alphaMin에 도달하면 시뮬레이션은 중지됩니다.

기본 값은 1입니다.

simulation.alphaMin(min)

기본 값은 0.001입니다. 기본 alpha값이 alphaMin에 도달하는 경우는 300회 반복에 해당됩니다.

simulation.alphaDecay(decay)

알파 감쇠율을 지정하여 alpha값이 감소되는 속도를 제어합니다. 일반적으로 decay가 낮을수록 실행 시간이 더 오래 걸리고 더 나은 레이아웃이 나옵니다.

기본 값은 0.001이고 0일 경우 무한입니다.

simulation.alphaTarget(target)

현재 alpha를 지정된 숫자로 설정합니다.

simulation.velocityDecay(decay)

시뮬레이션의 nodes들이 서서히 감속되는 속성을 조절합니다. decay가 높을수록 객체의 속도는 더 빨리 감소하고 낮을 수록 속도는 천천히 감소합니다.

velocityDecay 값이 너무 높으면 node들이 멈출 수는 있지만 안정성은 증가합니다.

simulation.force(name,force)

force를 추가하는 데 사용됩니다. name을 통하여 force의 이름을 지정할 수 있습니다. 해당 name으로 삭제하거나 수정할 수 있습니다. 

simulation.find(x, y, radius)

주어진 검색 반경 x, y, 위치에 radius에서 가장 가까운 node를 반환합니다. radius를 지정하지 않으면 무한대입니다.

simultaion.randomSource(source)

난수를 생성하는 데 사용됩니다. 0이상 1미만 사이의 숫자를 반환합니다.

simulation.on(typenames,listener)

리스너가 지정된 경우 유형 이름에 대한 리스너를 설정합니다. 이벤트가 이미 등록된 경우 새 이벤트 리스너가 추가되기 전에 기존 리스너가 제거됩니다. 리스너가 지정되지 않으면 유형 이름과 일치하는 현재 할당된 리스너를 반환합니다.

typenames로는 tick과 end가 있습니다.

tick은 시뮬레이션 내부 타이머의 각 tick 이후마다 호출되고

end는 alpha < alphaMin일 때 호출됩니다.

simultaion.tick을 수동으로 호출하면 tick 이벤트가 전달되지 않습니다.

Custom forces

힘은 단순히 노드의 위치나 속도를 수정하는 기능입니다. force를 이용하여 물리적 힘과 기하하적 제약을 해결할 수 있습니다. 노드의 현재 위치에서 속도를 더하거나 뺍니다.

force(alpha) 

force가 적용된 지정된 alpha를 관찰할 수 있습니다.

force.initialize(nodes)

force에 적용될 node들을 초기화하는 합니다. 초기화 하면서 random 값이 들어갑니다.