0

円をクリックすると、d3.jsライブラリを使用してソリューションを開発しています。ズームする必要があり、円の中にデータを表示する必要があります。

最初のステップとして、Json ファイルからデータをロードしようとしていました。

以下はjsonファイルの内容で、私はVisual Studio 2012を使用しています。

mydata.json

[{"name":"Ravi","age":25},{"name":"aman","age":29}]

.html ファイルと .json ファイルの両方が同じフォルダーにありますが、それでもエラーが発生します。

行: 5734 エラー: プロパティ 'children' の値を取得できません: オブジェクトが null または未定義です

以下はスクリプトです：

    var canvas = d3.select("body").append("svg")
                 .attr("width", 500)
                  .attr("height", 500);

    d3.json("mydata.json", function (data) {
        var treemap = d3.layout.treemap()
        .size([500, 500])
        .nodes(data)
        console.log(treemap);

    });

</script>

注：ファイルをロードしてレイアウトツリーマップを使用しようとしていました。

ありがとう

4

1 に答える 1

1

何が起こっているのかをよりよく理解するには、debugger;+開発コンソールを使用するか、ログを追加します。

d3.json("mydata.json", function (error, data) {
  console.log(error);
  console.log(data);
    var treemap = d3.layout.treemap()
      .size([500, 500])
      .nodes(data)
    console.log(treemap);
});

ファイルをホストしpython -m SimpleHTTPServer、ナビゲートすると127.0.0.1:8000、コンピューターに次のログが記録されます。

null
[{"name":"Ravi","age":25},{"name":"aman","age":29}] 
[[{"name":"Ravi","age":25},{"name":"aman","age":29}]]

サーバー経由でファイルにアクセスしていないと思われます。私はそれをやってみます。

于 2013-07-11T17:06:01.917 に答える