d3.json php,d3.js – D3库 – 如何在此示例中从JSON访问数据

我没有在标题中正确解释这个问题…抱歉.

我有一个JSON文件,包含推文标签,感情值和推文文本;

(摘抄)

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"}];

我想使用“tweet”值作为每个“text”元素的“title”元素.

我尝试将我的推文放在.words函数(或.map,我不知道:s)中,因为其他数据以这种方式访问​​,但我无法提取我的’tweet’数据;

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返回undefined

我可能理解为什么我不能在.words或.map函数中使用我的推文,因为他们只期望某些参数,但我不知道如何将’tweet’数据放入’title’标签中每个’text’元素.

谁能帮我这个?

编辑:内部d3.json函数的代码;

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

});

我不知道如何让它像那样工作.我已经制作了json文件,但现在我无法访问数据或运行云.

编辑:文本元素现在附加在关闭正文标记之外:(

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

});

编辑:@Chris这是您在D3 json函数和我的自定义中的示例代码

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

}

})

但我无法从draw函数访问d.tweet:s

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值