【D3.js】Shape Tweening 練習中

D3.jsを使ったPathのアニメーションについて勉強中です。 path要素のアニメーションはcircle要素やrect要素を使ったアニメーションより、いろいろと手間がかかるのですが、その中でも地理情報を元に作成したPathを動かすのは結構難儀だったりします。 でも、これができるといろいろと表現の幅が広がるので、知恵熱だしながら下記サンプルを元に習作をつくってみました。 Shape Tweening Bubbly Gunma 上記サンプルを元に群馬県をバブルっぽくしてみました。 example ほとんど上記サンプルのままですが、簡単に説明すると、各市ポリゴンの中心座標を取得し三角関数を使って円の座標データを別に作成しています。円の描き方に関しては下記記事がとても参考になります。 openFrameworks – いろいろな方法で円を描く、インタラクションを付加する 線グラフを群馬県にする

[Lhankor_Mhy]

『線グラフを群馬県にする』

[ujigislab]

線グラフを群馬県にする「何を言っているのかわからねーと思うが、 俺も何をやりたかったのかわからなかった」