使用d3.用Json代替d3.csv来创建气泡图

use d3.json instead of d3.csv to create bubble chart

本文关键字:d3 创建 气泡 代替 Json 使用 csv      更新时间:2023-09-26

我试图使用以下代码来创建一个气泡图: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…)不工作。而我得到的只是一张白纸。我非常感谢你的建议。

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;

并在回调中使用classesforEach