在HTML中嵌入csv以便與D3.js一起使用

Question

在D3.js中，通常會從外部csv文件加載數據。這對於大數據非常有效，並避免在數據更改時更改代碼。

不過，也有在這裏我想直接在HTML頁面中嵌入CSV兩種情況（只有使用小CSV數據）：

• 可以在本地加載的頁面（即從文件：/// ），而不需要運行本地HTTP服務器。
• 一個小的jsfiddle例子，解釋了在stackoverflow上使用的D3.js問題。

Answer 1

這是我使用D3.js API的示例提出的解決方案。

嵌入CSV數據：

<pre id="csvdata"> 
    Year,Make,Model,Length 
    1997,Ford,E350,2.34 
    2000,Mercury,Cougar,2.38 
</pre> 

Hidding頁面上的原始數據：

#csvdata { 
    display: none; 
} 

解析它：

var raw = d3.select("#csvdata").text(); 
var parsed = d3.csv.parse(raw); 

可選，顯示結果：

d3.select("#parsed").text(JSON.stringify(parsed)); 
// Assuming <div id="parsed"></div> somewhere on the page 

如果認爲這是有缺陷的，或者如果您有更優雅的解決方案，我會很樂意接受您的答案！編輯：看到它在行動中this fiddle