使用d3.json而不是d3.csv来创建气泡图

时间:2016-10-26 17:43:16

标签: javascript php json csv d3.js

我尝试使用以下代码创建气泡图: https://bl.ocks.org/mbostock/4063269 此代码使用它来加载csv文件:

d3.csv("flare.csv", function(d) {
  d.value= +d.value;
  if (d.value) return d;
}, function(error, classes) {
  if (error) throw error;

我想加载一个json文件,所以我写了这个:

d3.json("data1.php", function(d) {
    d.forEach(function(data) {
        data.value= +data.value;
    });
    if (d.value) return d;
    },function(error, classes) {
  if (error) throw error;

php文件的输出是这样的:

[{"disease":"Cold","value":"33"},{"disease":"Anemia","value":"23"},{"disease":"Hepatitis B","value":"21"},{"disease":"Gum disease","value":"19"},{"disease":"Lung Cancer","value":"17"},{"disease":"Diarrhea","value":"15"},{"disease":"Strep Throat","value":"13"},{"disease":"STDs","value":"11"},{"disease":"Heart Disease","value":"8"},{"disease":"Type 2 Diabetes","value":"6"}]

由于某种原因,我的代码(使用d3.json ...)无效。而我只是得到一个空白页面。我非常感谢您的投入。

1 个答案:

答案 0 :(得分:1)

d3.csv不同,d3.json 接受访问者功能。

所以,而不是:

d3.json("data1.php", function(d) {
    d.forEach(function(data) {
        data.value= +data.value;
    });
    if (d.value) return d;
    }, function(error, classes) {
    if (error) throw error;

应该是这样的:

d3.json("data1.php", function(error, classes) {
    if (error) throw error;

在回调中使用forEach进行classes