D3.js - 分隔值 API

分隔符是一個或多個字元的序列，用於指定純文字或其他資料中單獨的獨立區域之間的邊界。欄位分隔符是逗號分隔值的序列。好吧，分隔符分隔值是逗號分隔值 （CSV）或製表符分隔值 （TSV）。本章詳細介紹了分隔符分隔值。

配置 API

我們可以使用以下語法輕鬆載入 API。

<script src = "https://d3js.org/d3-dsv.v1.min.js"></script>
<script>
   var data = d3.csvParse(string);
</script>

API 方法

以下是分隔符分隔值的各種 API 方法。

• d3.csvParse(string[, row])
• d3.csvParseRows(string[, row])
• d3.csvFormat(rows[, columns])
• d3.csvFormatRows(rows)
• d3.tsvParse(string[, row])
• d3.tsvParseRows(string[, row])
• d3.tsvFormat(rows[, columns])
• d3.tsvFormatRows(rows)

讓我們詳細介紹這些 API 方法。

d3.csvParse(string[, row])

此方法用於解析 csv 格式。考慮下面顯示的檔案 data.csv。

year,population
2006,40
2008,45
2010,48
2012,51
2014,53
2016,57
2017,62

現在，我們可以應用上面給出的功能。

示例 - 讓我們考慮以下示例。

var data = d3.csvParse(string, function(d) {
   return {
      year: new Date(+d.Year, 0, 1), // lowercase and convert "Year" to Date
      population: d.population
   };
});

在這裡，它在分隔符分隔值中解析指定的字串。它返回一個表示已解析行的物件陣列。

d3.csvParseRows(string[, row])

此方法用於解析與行等效的 csv 格式。

var data = d3.csvParseRows(string, function(d, i) {
   return {
      year: new Date(+d[0], 0, 1), // convert first colum column to Date
      population: d[1],
   };
});

它解析 csv 檔案中的每一行。

d3.csvFormat(rows[, columns])

此方法用於格式化 csv 行和列。

示例 - 讓我們考慮以下示例。

var string = d3.csvFormat(data, ["year", "population"]);

這裡，如果未指定列，則構成標題行的列名列表由行中所有物件的所有屬性的並集確定。如果指定了列，則它是表示列名稱的字串陣列。

d3.csvFormatRows(rows)

此方法用於格式化 csv 行。

示例 - 讓我們考慮以下示例。

var string = d3.csvFormatRows(data.map(function(d, i) {
   return [
      d.year.getFullYear(), // Assuming d.year is a Date object.
      d.population
   ];
}));

在這裡，它將指定的字串行陣列格式化為分隔符分隔值，返回一個字串。

d3.tsvParse(string[, row])

此方法用於解析 tsv 格式。它類似於 csvParse。

d3.tsvParseRows(string[, row])

此方法用於解析等效於行的 tsv 格式。它類似於 csvParseRows 函式。

d3.tsvFormat(rows[, columns])

此方法用於格式化 tsv 行和列。

d3.tsvFormatRows(rows)

此方法用於格式化 tsv 行。