LATEST ENTRIES
CATEGORIES
ARCHIVES
SPONSORED LINK
MOBILE
qrcode
LINKS
PROFILE
OTHERS

09
--
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
--
>>
<<
--

Agata's Blog

MATLABやPythonとともにD3.jsを使ってデータ解析とデータビジュアライゼーションに挑戦する某エンジニアのBlog
<< プルダウンメニューを使ってインタラクティブに散布図を更新 | main | D3.js v4でTree図を作成する (2) >>
D3.js v4でTree図を作成する (1)
0

    D3.js が Ver.4 にアップデートしていろいろなところが変わりましたが、Treeレイアウトの作成方法もその1つです。この変更によって、残念ながら Ver.3 でのTreeレイアウトのプログラムは Ver.4 では動作しなくなってしまいました。

     

    さらに困ったことに、Ver.4 でTreeレイアウトを作成しようとしても、簡単なサンプルがなかなか見当たらないのが現状です (特に日本語では) 。例えばインターネットを検索すると「d3.js version4でシンプルなTree図を作成」という記事も見つかるのですが、ノードどうしを線でつなぐ部分の関数が複雑だったり、コードの説明がほとんどなかったりして、おそらくD3.jsを学びはじめた人にとってはハードルが高そうです。

     

    そこで、D3.js Ver.4 を使って、ごくごくシンプルなTree図を作成するサンプルプログラムを作ってみました。コードの中にも簡単な説明を入れましたが、それぞれの関数について次回紹介したいと思います。

     

     

    JUGEMテーマ:JavaScript

    このエントリーをはてなブックマークに追加
    | D3.js | 21:06 | comments(0) | - | - |
    スポンサーリンク