d3.json()で読み込みを行った時点でJavaScriptオブジェクトとしての扱いとなります。 この例ならばdata()に配列部分を渡すようにするなどして、階層の変更に対応すれば良いということになります。 // 読み込みデータファイル var DATA_FILE_PATH = './data.json'; // 一覧描画先 var TARGET_ELEMENT_ID = '#data'; // 項目名:漢字表記 var COL_KANJI = 'kanji'; // 項目名:かな表記 var COL_KANA = 'kana'; // 項目名:色ID var COL_COLOR_ID = 'color'; drawTable(); /** * データ一覧の描画 */ function drawTable() { d3.json(DATA_FILE_PATH, function(erro
![D3.js JSONデータを読み込む - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/44bbd2d5ea3c654c0b102da63a35b10c4ba14a97/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fadvent-calendar-ogp-background-7940cd1c8db80a7ec40711d90f43539e.jpg%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9RDMuanMlRTMlODAlODBKU09OJUUzJTgzJTg3JUUzJTgzJUJDJUUzJTgyJUJGJUUzJTgyJTkyJUU4JUFBJUFEJUUzJTgxJUJGJUU4JUJFJUJDJUUzJTgyJTgwJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMzQTNDM0MmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz00NGJiOTM3NGZiNTMxYzIwN2U0MTBmNWY4NzhmMjViYQ%26mark-x%3D120%26mark-y%3D96%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9OTcyJnR4dD0lNDBUYWtlc2hpLVVjaGlkYSZ0eHQtY29sb3I9JTIzM0EzQzNDJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NWNhMTM3NWQxNTY3NzIwMmM4ZjZlODRmNDlmYzVhYmI%26blend-x%3D120%26blend-y%3D500%26blend-mode%3Dnormal%26s%3D948bc399bdc768a8c9aa8e59a076e738)