D3.js教程

D3.js - Delimiter-Separated Values 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
   ];
}));

这里，它将指定的字符串行数组格式化为分隔符分隔值，返回一个字符串.