CSV 表格文件是以逗號作為單元分隔符的,其他還有以制表符 Tab 作為單元分隔符的 TSV 文件,還有人為定義的其它分隔符的表格文件。本文將說明在 D3 中如何讀取它們。
## 1. TSV 表格文件是什么
TSV(Tab Separated Values),制表分隔值,它和 CSV 文件僅僅是分隔符不一致。它的格式如下:
~~~
name age
張三 22
李四 24
~~~
## 2. D3 中讀取 TSV 文件
在 D3 中讀取 TSV 文件的方法和 CSV 文件是一樣的,只要更改一下函數名即可。方法如下:
~~~
d3.tsv("table.tsv",function(error,tsvdata){
console.log(tsvdata);
var str = d3.tsv.format( tsvdata );
console.log(str.length);
console.log(str);
});
~~~
我們可以看到,這和[【進階系列 — 1.0】](http://www.ourd3js.com/wordpress/?p=430)是基本一樣的,詳細說明可參見此文。
## 3. D3 中讀取 CSV 和 TSV 的本質
在上面兩節我們可以看到,讀取 CSV 和 TSV 驚人地相似。其實它們本質上都是一個函數,我們來看看 D3 源碼中的定義:
~~~
d3.csv = d3.dsv(",", "text/csv");
d3.tsv = d3.dsv(" ", "text/tab-separated-values");
~~~
可以看到,它們其實都是 d3.dsv 函數。那么這個 dsv 函數是怎么回事呢?dsv 其實可以讀取以任意字符或字符串作為分隔符的表格文件。接下來我們來試試用 dsv 函數讀取以分號作為分隔符的表格文件。假設有如下文件:
~~~
name;age
張三;22
李四;24
~~~
讀取的代碼如下:
~~~
var dsv = d3.dsv(";", "text/plain");
dsv("table.dsv",function(error,dsvdata){
if(error)
console.log(error);
console.log(dsvdata);
});
~~~
先用?d3.dsv(";", "text/plain"); 定義分隔符為分號,再按照讀取 csv 和 tsv 文件一樣的方法讀取即可。但要注意第二行不再需要用 d3.dsv ,因為變量 dsv 已經是一個函數了。
## 4. 結束語
CSV 文件和 TSV 文件僅僅是分隔符不同,它們的本質都是調用的 DSV 函數,所以 DSV 函數的掌握至關重要。
謝謝閱讀。
文檔信息
- 版權聲明:署名(BY)-非商業性(NC)-禁止演繹(ND)
- 發表日期:2014年10月03日
- 更多內容:[OUR D3.JS - 數據可視化專題站](http://www.ourd3js.com/) 和[CSDN個人博客](http://blog.csdn.net/lzhlzz)
- 備注:轉載請注明出處,謝謝