1 回答

TA貢獻(xiàn)1820條經(jīng)驗(yàn) 獲得超3個(gè)贊
您最近的問(wèn)題使用文本輸入元素來(lái)創(chuàng)建餅圖。這些元素有一個(gè)稱為 的屬性value
。div 則不然。
當(dāng)您使用它時(shí),whered
指的是一個(gè)元素:
.value(function(d)?{return?d.value;?})(data);
輸入元素將返回一個(gè)值,而 div 將返回未定義。因此你的 NaN 錯(cuò)誤:
console.log("div.value: ",d3.select("div").node().value);
console.log("input.value: ",d3.select("input").node().value);
console.log("input value an empty string: that's the content of the field");
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
<div>text</div>
<input></input>
但是,如果您的 div 元素僅包含相關(guān)文本,那么我們可以使用類似的方法element.innerHtml
來(lái)獲取數(shù)據(jù)。
console.log(d3.select("div").node().innerHTML);
<script?src="? <div>50</div>
如果你交換:
var?pie?=?d3.pie()??? ????.value(function(d)?{return?d.value;?})(data);
和:
var?pie?=?d3.pie()??? ????.value(function(d)?{return?d.innerHTML;?})(data);
您應(yīng)該有一個(gè)可行的解決方案。
請(qǐng)注意,在這兩種情況(輸入或 div)中,輸入都是字符串,這可能會(huì)導(dǎo)致問(wèn)題,具體取決于您使用數(shù)據(jù)的方式,將數(shù)據(jù)強(qiáng)制為數(shù)字通常是一個(gè)好主意,您可以使用一元來(lái)做到這一點(diǎn)+
:
var?pie?=?d3.pie()??? ????.value(function(d)?{return?+d.innerHTML;?})(data);
添加回答
舉報(bào)