我正在開發一個應用程式，其中資料集具有以編程方式生成的名稱，并且經常由用戶創建和銷毀。我想使用 D3.js 在應用程式中繪制這些資料集。
我的資料集是這樣存盤的：
| 波長 | 傳感器輸出 1 | 傳感器輸出 2 | 傳感器輸出 3 |
|---|---|---|---|
| 1 | 19 | 21 | 23 |
| 3 | 23 | 20 | 21 |
| 5 | 33 | 23 | 19 |
| 7 | 33 | 24 | 45 |
| 等等.. | 等等.. | 等等.. | 等等.. |
其中波長應沿 x 軸映射，幅度應沿 y 軸映射，每組幅度都有一條單獨的線。
我正在努力弄清楚應該如何將這些資料傳遞到 D3.js 中。我閱讀的每個教程都使用不同的資料格式和不同的代碼。我已經閱讀了檔案，但它對我學習如何為 D3 格式化資料也沒有太大幫助。
從腳本中將這些資料集映射到圖表的正確方法是什么？目前我正在嘗試使用d3.csvParse(data)，但不確定從那里去哪里。我懷疑我可能會笨拙地格式化我的資料，但不確定。
uj5u.com熱心網友回復：
寫一個快速的答案，以防其他人被困在我做的地方。基本上我完全誤解了你應該如何在 d3 中呈現資料。
這是理解 d3 資料處理的有用指南
這是一個有用的指南，說明如何在正確構建資料后使用該資料
一旦我意識到我需要創建一個陣列來代表我想要繪制的每個點，事情就變得容易多了。我創建了一個具有三個屬性的物件，這些屬性描述了一個資料點。
每個物件都有一個wavelength、magnitude和name。
wavelength是資料點在 x 軸上的位置，magnitude是它在 y 軸上的位置，并name允許我區分不同的資料集。
let array = [
{name: "dataset 1", wavelength: 2, magnitude: 20}
{name: "dataset 1", wavelength: 3, magnitude: 22}
{name: "dataset 1", wavelength: 4, magnitude: 19}
{name: "dataset 2", wavelength: 2, magnitude: 14} //and so on...
]
從那里我可以將其映射到我的圖表上
svg.append("path")
.data(array)
.attr("d", d3.line()
.x(function(d) {return x(d.wavelength)})
.y(function(d) {return y(d.magnitude)})
.z(function(d) {return z(d.name)});
您還可以按名稱對資料進行分組，d3.group()并手動遍歷資料，分別繪制每條線
感謝@Alexander Nied 和@Gerardo Furtado 讓我重回正軌！
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/440740.html
標籤：javascript d3.js 数据科学 数据格式 图形数据科学