d3.js（v4、v5）で、JSONファイルを読み込むには、d3.json メソッドを使用します。
目次
JSONファイルを読み込む
v4の例
読み込むJSONファイル（resource.json）
|
1 2 3 4 5 6 7 |
{ "product_sales":[ {"name":"apple","sales":100}, {"name":"peach","sales":75}, {"name":"banana","sales":120} ] } |
javascript
|
1 2 3 4 5 6 7 8 9 10 |
d3.json("resource.json", function(error, data){ // エラー処理 if(error != null){ ・・・ return; } // 通常処理（グラフの描画など） }); |
読み込んだJSONは、オブジェクトとして扱われます。
|
1 2 3 4 5 |
product_sales:[ {name: "apple", sales: "100"}, {name: "peach", sales: "75"}, {name: "banana", sales: "120"} ] |
次のようにアクセスできます。
|
1 |
data.product_sales |
v5の例
使用するJSONは先ほどと同じです。
javascript
|
1 2 3 4 5 6 7 8 |
d3.json("resource.json") .then(function(data){ // 通常処理（グラフの描画など） }) .catch(function(error){ // エラー処理 }); |
読み込んだ内容は、v4と同じくオブジェクトとして扱われます。
v4とv5で若干書き方が異なりますが、簡単にJSONファイルを読み込みことができます。