を使用してD3プラス可視化に使用されるJSONファイルをロードしようとしています、私はD3plusを使って、箱ひげ図を作成しようとアップロード/ jQueryを使って変数にJSONデータを格納しています:私はjQueryの
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="./JS/d3.min.js"></script>
<script src="./JS/d3plus.min.js"></script>
<script src="./JS/jQuery.min.js"></script>
</head>
<body>
<div id="viz"></div>
<script>
var data;
$.getJSON("./Data/boxplot.json", function(json) {
data = json;
});
var visualization = d3plus.viz()
.container("#viz")
.data(data)
.type("box")
.id("name")
.x("building")
.y("total")
.time(false)
.height(800)
.ui([{
"label": "Visualization Type",
"method": "type",
"value": ["scatter","box"]
}])
.draw()
</script>
</body>
</html>
jsonデータをファイルにコピーアンドペーストすれば、それは動作します。しかし、 "Data"フォルダに格納された外部jsonファイルからデータを取得しようとすると、動作しません。私はエラーが発生する: "ボックスプロットの視覚化は、"データ "メソッドを設定する必要があります。ここで
は、私のファイル構造である:ここで
は私のJSONファイルです:
[{"building":"MMB","name":"Shane","total":1},{"building":"MMB","name":"Geneviève, Bérubé","total":1},{"building":"MMB","name":"Dana","total":10},{"building":"MMB","name":"karine","total":2},{"building":"MMB","name":"Anthony","total":1},{"building":"MMB","name":"Erwin","total":6},{"building":"MMB","name":"Jake","total":2},
{"building":"MMB","name":"Karen","total":1},{"building":"MMB","name":"sabrina","total":2},{"building":"MMB","name":"Jeannine","total":4}]
はお時間をありがとうございました!
EDIT:そのような
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="./JS/d3.min.js"></script>
<script src="./JS/d3plus.min.js"></script>
<script src="./JS/jQuery.min.js"></script>
</head>
<body>
<div id="viz"></div>
<script>
$.getJSON("./Data/boxplot.json", function(json) {
data = json,
success = function(data){
.container("#viz")
.data(data)
.type("box")
.id("name")
.x("building")
.y("total")
.time(false)
.height(800)
.ui([{
"label": "Visualization Type",
"method": "type",
"value": ["scatter","box"]
}])
.draw()
}
})
</script>
</body>
</html>
可能な重複[どのように応答を返さない:
と参照用
、ここではデータメソッドに設定できるカスタムプロパティのすべてです:単にデータメソッドにパスを渡します非同期呼び出しから?](http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) –$ .getJSONは非同期です - したがって、データはありませんgetJSON呼び出しが実行された後にコードが作成されるまで –