Question

我正在尝试使用JS进行数据可视化，从动态json文件中获取值，但无法通过控制台可视化我的数据。

这个想法是能够使用这4个值（outputValue0，outputValue1，outputValue2，outputValue3）来修改形状和其自身的颜色。我应该如何调用变量以在javaScript中访问它们？

这是我的代码：

var lines = "waiting for data"; 
var val0 = 0; // I get a 0, of course, but I need the actual value
var val0 = []; //I get nothing with this

function setup() {
createCanvas(400,400);
loadJSON('http://www.----------.com/data_to_json.php', gotData);
}

Object.size = function(obj){
var size = 0, key;
for(key in obj){
    if(obj.hasOwnProperty(key)) size++;
}
return size;
}

function gotData(data) {

var size = Object.size(data) - 1;
console.log(size);
console.log(data[size]['timeStamp']);
console.log(data[size]['outputValue0'] + " " + data[size]['outputValue1'] + " " + data[size]['outputValue2']+ " " + data[size]['outputValue3']);
 lines = size;
 var val0 = data[size]['outputValue0'];

 }

 function draw(){
 background(158, 152, 207);
 textAlign(LEFT);
 fill(0);
 text('Emotional analysis', 10, height - 370);
 text(lines + ' emotions stored',10,height -20);
 text(val0,10,height -60)

 }

我的控制台上几乎没有错误，但是我认为这无关：

InvalidStateError：试图使用一个不可用或不再可用的对象已过时的东方电子传感器。（已过时使用传感器） p5.js：9298：6 电影已过时。（已过时使用传感器） p5.js：9298：6 240 sketch.js：20：3 2019-02-08 22:03:09 sketch.js：21：3 20 20 19 20 sketch.js：22：3

json文件如下所示：

[{"timeStamp":"2019-02-08 13:38:53","outputValue0":"18","outputValue1":"18","outputValue2":"18","outputValue3":"18"},
{"timeStamp":"2019-02-08 13:39:03","outputValue0":"18","outputValue1":"18","outputValue2":"19","outputValue3":"18"},
{"timeStamp":"2019-02-08 13:39:13","outputValue0":"18","outputValue1":"18","outputValue2":"19","outputValue3":"18"},
{"timeStamp":"2019-02-08 13:39:23","outputValue0":"18","outputValue1":"19","outputValue2":"19","outputValue3":"19"},
{"timeStamp":"2019-02-08 13:39:33","outputValue0":"18","outputValue1":"19","outputValue2":"20","outputValue3":"19"}]

Answer 1

您似乎正在尝试填充一些全局变量。但是您在范围上犯了错误，而且通常也认为这是一种有缺陷的设计模式。同样，目前您似乎没有实际调用draw()函数的地方。

如果draw()接受一些参数（例如，

function draw(val0, val1, val2, val3) {

然后在gotData函数中可以编写

draw(data[size]['outputValue0'], data[size]['outputValue1'], data[size]['outputValue2'], data[size]['outputValue3']);

将值传递给它，并更改形状。

如何通过javaScript从json访问数据？

1 个答案: