在D3中使用JSON数据

Question

我想稍后在代码中使用json数据，因此将其放入变量中并将变量返回给函数。 如果我对json数据进行了硬编码（请参见下文，那么代码的第二部分只是为了让我可以检查其是否有效）

function read() {
var data = [{"APSYear":"2014","Domain":"Reading","Level":"3","KWC":"469.62","Aus":"418.3","Vic":"431.7","P90":"544.92"}];
data.forEach(function(d) {
     readkwc = d.KWC;
     readvic = d.Vic;
     read90 = d.P90;    
});
return [readkwc, readvic, read90];
}
var read = read();
var body = d3.select('body');
body.append('p')
    .text(read[0])
    .append('p')
    .text(read[1])
    .append('p')
    .text(read[2]);

但是如果我从文件中读取json代码，它将无法正常工作（请参见下文）

function read() {
d3.json("statsread.php", function(error, data) {
data.forEach(function(d) {
    readkwc = d.KWC;
    readvic = d.Vic;
    read90 = d.P90; 
    });
}); 
return [readkwc, readvic, read90];
}
var read = read();
var body = d3.select('body');
    body.append('p')
        .text(read[0])
        .append('p')
        .text(read[1])
        .append('p')
        .text(read[2]);

我要去哪里错了？

Answer 1

• 您正在函数内部向“ statsread.php”发出异步请求，因此您将立即获取数据。 因此var read = read(); 将是不确定的。

• 当API失败时，变量“ readkwc，readvic，read90”将不可用，因此您也需要处理失败情况。

解决方法是这里。

 var body = d3.select('body'); function read() { d3.json("statsread.php", function(error, data) { if (error) return console.warn(error); data.forEach(function(d) { readkwc = d.KWC; readvic = d.Vic; read90 = d.P90; }); var read = [readkwc, readvic, read90]; body.append('p') .text(read[0]) .append('p') .text(read[1]) .append('p') .text(read[2]); }); } read(); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>