D3 Bibliothèque — Comment Accéder À des Données JSON dans cet exemple

Je n'ai pas à expliquer le problème correctement dans le titre... Désolé.

Je suis à la suite de la D3 Tag Cloud Simple exemple
https://github.com/jasondavies/d3-cloud/blob/master/examples/simple.html

J'ai un fichier JSON qui se compose de tweet balises, sentimental, les valeurs et les tweet de texte;
(extrait)

var words = [{"word":"disgrace","sentiment":"0.975","tweet":"Wheres Fred the weatherman? \nIn jail #disgrace #dirtyman @MrJimmyCorkhill"},{"word":"dirtyman","sentiment":"0.975","tweet":"Wheres Fred the weatherman? \nIn jail #disgrace #dirtyman @MrJimmyCorkhill"}];

Je veux utiliser le "tweet" de la valeur en tant que "titre" de chaque "texte" de l'élément.
J'ai essayé de faire cela en mettant mon tweet dans le .les mots de fonction (ou de .carte, je ne sais pas :s), que d'autres données est accessible de cette façon, mais je ne peux pas extraire mon 'tweet' données;

var fill = d3.scale.category20();
var words = <?php echo $tweets->getTweetTags(); ?>;
d3.layout.cloud().size([1000, 1000])
.words(words.map(function(d) {
return {text: d.word, size: d.sentiment * 40, tweet: d.tweet};
}))
.rotate(function() { return ~~(Math.random() * 2) * Math.random() * 1; })
.font("Impact")
.fontSize(function(d) { return d.size; })
.on("end", draw)
.start();
function draw(words) {
d3.select("#vis").append("svg")
.attr("width", 1000)
.attr("height", 1000)
.append("g")
.attr("transform", "translate(500,400)")
.selectAll("text")
.data(words)
.enter().append("text")
.style("font-size", function(d) { return d.size + "px"; })
.style("font-family", "Impact")
.style("fill", function(d, i) { return fill(i); })
.attr("text-anchor", "middle")
.attr("transform", function(d) {
return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
})
.text(function(d) { return d.text; })
.append("svg:title").text(function(d) { return d.tweet; } );
}

d.tweet renvoie undefined

Je peux sans doute comprendre pourquoi je ne peux pas utiliser mon tweet dans le .des mots ou des .carte de fonction, comme ils ne s'attendent à certains paramètres, mais je ne sais pas comment pour obtenir le 'tweet' données dans le titre, les balises de chaque "texte" de l'élément.

Quelqu'un peut-il m'aider?

Edit: Code avec l'intérieur de la d3.json fonction;

var data; //a global
d3.json("../../../assets/json/tweetTags.json", function(error, json) {
if (error) return console.warn(error);
data = json;
var fill = d3.scale.category20();
d3.layout.cloud().size([1000, 1000])
.words(data.map(function(d) {
return {text: d.word, size: d.sentiment * 40, tweet: d.tweet};
}))
.rotate(function() { return ~~(Math.random() * 2) * Math.random() * 1; })
.font("Impact")
.fontSize(function(d) { return d.size; })
.on("end", draw)
.start();
function draw(data) {
d3.select("#vis").append("svg")
.attr("width", 1000)
.attr("height", 1000)
.append("g")
.attr("transform", "translate(500,400)")
.selectAll("text")
.data(words)
.enter().append("text")
.style("font-size", function(d) { return d.size + "px"; })
.style("font-family", "Impact")
.style("fill", function(d, i) { return fill(i); })
.attr("text-anchor", "middle")
.attr("transform", function(d) {
return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
})
.text(function(d) { return d.text; })
.append("svg:title").text(function(d) { return d.tweet; } );
}
d3.layout.cloud().size([300, 300])
.data.map(function(d) {
return {text: d, size: 10 + Math.random() * 90};
})
.rotate(function() { return ~~(Math.random() * 2) * 90; })
.font("Impact")
.fontSize(function(d) { return d.size; })
.on("end", draw)
.start();
});

Je ne sais pas comment le faire fonctionner comme ça. J'ai fait le fichier json, mais maintenant je ne peux pas accéder aux données ou d'exécuter le nuage.

Edit: Les éléments de texte sont en ajoutant à l'extérieur de la balise body de clôture maintenant 🙁

var data; //a global
d3.json("../../../assets/json/tweetTags.json", function(error, json) {
if (error) return console.warn(error);
data = json;
var fill = d3.scale.category20();
d3.select("#vis").append("svg")
.attr("width", 1000)
.attr("height", 1000)
.append("g")
.attr("transform", "translate(500,400)")
.data(json)
.enter().append("text")
.style("font-size", function(d) { return d.sentiment * 40 + "px"; })
.style("font-family", "Impact")
.style("fill", function(d, i) { return fill(i); })
.text(function(d) {return d.word;})
.append("svg:title").text(function(d) { return d.tweet; } );
});

Edit: @Chris C'est votre exampled code de la D3 json fonction et avec mes personnalisations

d3.json("../../../assets/json/tweetTags.json", function(error, json) {
if (error) return console.warn(error);
var fill = d3.scale.category20();
d3.layout.cloud().size([600, 500])
.words(json.map(function(d) {;
return {text: d.word, size: d.sentiment * 40, tweet: d.tweet};
}))
.rotate(function(d) { return ~~(Math.random() * 2) * 90; })
.font("Impact")
.fontSize(function(d) { return d.size; })
.on("end", draw)
.start();
function draw(words) { 
d3.select("body").append("svg")
.attr("width", 600).attr("height", 500)
.append("g").attr("transform", "translate(350,350)")
.selectAll("text").data(words)
.enter().append("text")
.style("font-size", function(d) { return d.size + "px"; })
.style("font-family", "Impact")
.style("fill", function(d, i) { return fill(i); })
.attr("text-anchor", "middle")
.attr("transform", function(d) {
return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
})
.text(function(d) { return d.text; }).append("svg:title")
.text(function(d) { return d.tweet; } );
}
})

Mais je ne peux pas accéder à d.tweet de la fonction draw :s

OriginalL'auteur user1977072 | 2013-01-21