亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

通過 d3.js 顯示從 div html 獲取的變量值

通過 d3.js 顯示從 div html 獲取的變量值

慕絲7291255 2023-06-29 22:28:24
我正在嘗試顯示數組的值,但由于某種原因它只顯示 NaN...有人可以幫助完成這項工作嗎?提前致謝。   <td>     <div class="values">       {{ value1 }}    </div>    </td>        <td>    <div class="values">     {{ value2 }}     </div>        </td>        <td>    <div class="values">     {{ value3 }}    </div>    </td>  var data = d3.selectAll('.values').nodes();  console.log(data);  var pie = d3.pie()   //we create this variable, for the values to be readeable in the console    .value(function(d) {return d.value; })(data);  console.log(pie);{{ Value1 }}、{{ Value2 }} 和 {{ Value 3 }} 已正確部署,這是來自 html 的圖片:
查看完整描述

1 回答

?
DIEA

TA貢獻1820條經驗 獲得超3個贊

您最近的問題使用文本輸入元素來創建餅圖。這些元素有一個稱為 的屬性value。div 則不然。

當您使用它時,whered指的是一個元素:

.value(function(d)?{return?d.value;?})(data);

輸入元素將返回一個值,而 div 將返回未定義。因此你的 NaN 錯誤:

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 元素僅包含相關文本,那么我們可以使用類似的方法element.innerHtml來獲取數據。

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);

您應該有一個可行的解決方案。

請注意,在這兩種情況(輸入或 div)中,輸入都是字符串,這可能會導致問題,具體取決于您使用數據的方式,將數據強制為數字通常是一個好主意,您可以使用一元來做到這一點+

var?pie?=?d3.pie()???
????.value(function(d)?{return?+d.innerHTML;?})(data);


查看完整回答
反對 回復 2023-06-29
  • 1 回答
  • 0 關注
  • 223 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號