var simulation = d3.forceSimulation();

란 무엇입니까?



와 같은 그래프 시각화가 가능한 시스템. 링크처를 보면 코드의 쓰는 방법은 대체로 알지만, 실제로 자신의 데이터로 해 보면, 좋은 느낌이 되는 파라미터의 조정이 의외로 어렵기 때문에, 이 세계를 간단하게 해설한다. 자세한 설명은
htps : // 기주 b. 이 m / d3 / d3 - 흠

힘

1. 마찰력

이 세계에는 마찰력이 있기 때문에 움직이는 것은 곧 멈춘다.

simulation.velocityDecay(0.01)

로 마찰 계수를 지정할 수 있다. 좋은 느낌이 되기 전에 멈추어 버리는 경우는 작고, 흔들흔들 계속해서 곤란한 경우는 크게 한다. 기본값은 0.4입니다.

2. 중력

아리스토텔레스의 중력 잘, 세계의 중심에 떨어지는 힘 d3.forceCenter .

simulation.force("center", d3.forceCenter(width / 2, height / 2))

한 점이 아니라 일직선상에 떨어지게 하고 싶은 경우는 d3.forceX(x) d3.forceY(y) 가 있다.

3. 스프링

소위 후크의 법칙. 그래프의 edge/link/가지가 distance 보다 긴 경우는 그 신장에 비례하여 당겨지고, 짧은 경우는 밀어 넣는다. 힘은 strength 에서 지정할 수 있지만, 2보다 큰 값을 넣으면 왠지 폭발한다.

simulation.force("link", d3.forceLink().id(function(d) { return d.id; }))

simulation.force("link")
          .links(graph.links)
          .distance(function(){ return 10;})
          .strength(function(){ return 2; })

4. 쿨롱력/만유인력

simulation.force("charge", d3.forceManyBody())

simulation.force("charge")
          .strength(function() { return -0.1; })

strength 에 음수를 넣으면 서로 반발하여 양수라고 잡는다.

5. 접촉력

d3.forceCollide([radius])

그래프의 vertex/node/정점이 반경 radius 의 구와 같이 부딪히게 된다.

고정

node0 = simulation.nodes()[0]
node0.fx = x;
node0.fy = y;

node0를 (x, y)에 고정합니다.

알파

alpha 라고 하는 것은 모래시계와 같은 것으로, 시간과 함께 줄어들어, 몇 단계 세계가 움직이는지를 관장한다.

simulation.alpha([alpha])  // = 1
simulation.alphaMin([min]) // = 0.001
simulation.alphaDecay([decay]) // = 0.0228 = 1 - pow(0.001, 1/300)
simulation.alphaTarget([target]) // = 0

1 단계로 (단위 시간당) 속도가 마찰력으로

velocity <- velocity * velocityDecay

만큼 감소해, alpha 하지만,

alpha <- alpha + (alphaTarget - alpha) * alphaDecay

된다. alpha가 alphaMin 이하로 떨어지면 멈추고 기본 매개 변수는 300 단계에 해당합니다. 왜 그런 매개 변수인지 모르겠지만 :

alpha 는 alphaTarget 에 점근한다.

따라서 alphaTarget가 alphaMin 이상이라면 멈추지 않는다.

alphaDecay가 크면 적은 단계로 alphaTarget에 접근하여 멈춘다.

예

장기의 초반을 그래프로 해 보았지만, 벌어지거나 해서 좀처럼 생각할 수 없다...
h tps : // 준코다. 기주 b. 이오/쿄멘/g 등 ph/2016_1. HTML