Impossible de charger le fichier JSON dans d3.js

Question

Je développe la solution en utilisant la bibliothèque d3.js lorsque l'on clique sur Cercle. Il doit être agrandi et les données doivent être affichées à l'intérieur du cercle. Dans un premier temps, j'essayais de charger les données à partir du fichier Json. Voici le contenu du fichier json et j'utilise Visual Studio 2012.

mydata.json

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

deux. Le fichier html et le fichier .json sont dans le même dossier, mais je reçois toujours une erreur.

Ligne: 5734 Erreur: Impossible d'obtenir la valeur de la propriété 'enfants': l'objet est

null ou undefined Voici le script:

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> 

Note: J'étais juste essayer de charger le fichier et en utilisant treemap mise en page.

Merci

Answer 1

Pour avoir une meilleure idée de ce qui se passe, utilisez debugger; + un dev console ou ajouter l'enregistrement:

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); 
}); 

Accueillir les fichiers avec python -m SimpleHTTPServer et naviguer vers 127.0.0.1:8000 enregistre les suivantes sur mon ordinateur:

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

qui me fait penser que vous n'accédez pas t il file à travers un serveur; Je voudrais essayer de faire that.