JSON字符串上的D3.js NaN错误

尝试从JSON编码的字符串设置d3 rect的宽度时出现NaN错误,并且 我没有看到我正在搞砸的地方。</ p>

问题的一些背景:
</ p>

表单中带有复选框的HTML页面使AJAX调用 PHP检查并取消选中</ p>

PHP根据复选框的状态构建mySQL查询</ p>

PHP编码mySQL返回JSON </ p>

PHP然后:$ json = preg_replace('/“( - ?\ d + \。?\ d *)”/','$ 1',$ toecho); </ p>

/ * ^(这样做是为了删除整数/浮点数周围的双引号)^ * / </ p>

PHP echos $ json到HTML div </ p>

Javascript分配 div的innerHTML到名为res的变量</ p>

  var res = document.getElementById(“result”)。innerHTML; 
</ code> </ pre>

< p>然后,部分脚本尝试:</ p>

  var bars = canvas.selectAll(“rect”)
.data(res)
.enter()
.append(“rect”)
.attr(“width”,function(d){return parseInt (d.value1)})
.attr(“height”,10)
.attr(“y”,function(d,i){return i * 100});

}
</ code> </ pre>

我收到NaN错误,我很难找到原因。 preg_replaceed JSON数据是这样的:</ p>

  [{“value1”:60},{“value1”:14},{“value1”:3},{“value1  “:7}] 
</ code> </ pre>

似乎是正确的。 </ p>

尝试将value1的int值分配给条的宽度。 我的方法可能很复杂,我总是建议我如何做得更好,但我也很想知道,即使我不是以最好的方式做到这一点(它需要的时间) 在数据库中大约5000行告诉我这是一个非常繁琐的过程)</ p>

任何人都知道我搞砸了什么,如何解决这个问题,和/或更有效地做到这一点?</ p>
</ div>

展开原文

原文

I'm getting a NaN error when trying to set the width of a d3 rect from a JSON encoded string, and I'm not seeing where I'm mucking things up.

Some background of the problem:

HTML Page with checkboxes in a form makes AJAX call to PHP on check and uncheck

PHP builds mySQL query based on status of checkboxes

PHP encodes mySQL's return to JSON

PHP then does: $json = preg_replace('/"(-?\d+\.?\d*)"/', '$1', $toecho);

/*^(this is done to remove double quotes around ints/floats)^*/

PHP echos $json to HTML div

Javascript assigns innerHTML of div to variable named res

var res = document.getElementById("result").innerHTML;

Then, part of the script attempts:

var bars = canvas.selectAll("rect")
        .data(res)
        .enter()
            .append("rect")
            .attr("width", function(d) {return parseInt(d.value1)})
            .attr("height", 10)
            .attr("y", function(d, i) {return i *100}); 
            }

I get a NaN error and I'm struggling to find why this is the case. The preg_replaceed JSON data is as such:

[{"value1":60},{"value1":14},{"value1":3},{"value1":7}]

which appears to be correct.

Things work up to the point of attempting to assign the int value of value1 to the width of the bar. My approach may be convoluted, and I'm always up for suggestions of how I might do this better, but I'd also really like to know that even if I'm not doing this in the best way (which the time it takes on roughly 5000 rows in the database tells me this is pretty process hungry)

Anybody know what I'm screwing up, how to fix this, and/or do this more efficiently?

drtppp75155
drtppp75155 <idea>返回div可能是让多个用户同时使用相同的mySQL信誉(静态PHP)访问并同时查询数据库,避免会话和清理外部jsons的简单方法。我会尝试用小提琴</idea>来提出更好地说明概念的东西
接近 6 年之前 回复
dqvrlgi3247
dqvrlgi3247 甜。不知何故,我错过了innerHTML上的JSON.parse,这有助于解决问题。更大的想法如下......
接近 6 年之前 回复
doubaben7394
doubaben7394 Chrome,而不是在innerHTML上重新:JSON.parse。
接近 6 年之前 回复
doubailian4459
doubailian4459 问题:从div读取JSON时,是否使用JSON.parse将JSON字符串转换为javascript关联数组(又称对​​象)?像varres=JSON.parse(document.getElementById(“result”)。innerHTML);
接近 6 年之前 回复
duanbi2760
duanbi2760 你使用哪种浏览器?json是有效的所以它必须是关于js代码的东西。当使用jslint时,它会强调parseInt缺少基数->parseInt(foo,10);也许你的浏览器也非常挑剔这个话题。
接近 6 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问