d3のforcesimulationで自分の指定したidを使う(Uncaught Error: missing: hogehoge)

はじめに

d3-forceのドキュメント(github - d3/d3-force)で、idは自分で決めてもいいよとあったので試したらハマった。

var nodes = [
  {"id": "Alice"},
  {"id": "Bob"},
  {"id": "Carol"}
];

var links = [
  {"source": "Alice", "target": "Bob"},
  {"source": "Bob", "target": "Carol"}
];

対処法

以下のような感じでsimulationを定義する際にlinkでidを指定する。

const simulation = d3.forcesimulation()
  .force("link", d3.forceLink().id((d)=>d.id))

おわりに

If id is specified, sets the node id accessor to the specified function and returns this force. If id is not specified, returns the current node id accessor, which defaults to the numeric node.index
github - d3/d3-force

ドキュメントを読んだら普通に書いてあった。説明書を読む習慣をつけないと...