D3.js - API giá trị được phân tách bằng dấu phân cách

Dấu phân cách là một chuỗi gồm một hoặc nhiều ký tự được sử dụng để xác định ranh giới giữa các vùng riêng biệt, độc lập trong văn bản thuần túy hoặc dữ liệu khác. Dấu phân cách trường là một chuỗi các giá trị được phân tách bằng dấu phẩy. Chà, các giá trị được phân tách bằng dấu phân cách làcomma separated values (CSV) hoặc tab-separated values(TSV). Chương này giải thích chi tiết các giá trị được phân tách bằng dấu phân cách.

Định cấu hình API

Chúng tôi có thể dễ dàng tải API bằng cú pháp sau.

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

Các phương thức API

Sau đây là các phương thức API khác nhau của các giá trị được phân tách bằng dấu phân cách.

  • d3.csvParse (string [, row])
  • d3.csvParseRows (string [, row])
  • d3.csvFormat (hàng [, cột])
  • d3.csvFormatRows(rows)
  • d3.tsvParse (string [, row])
  • d3.tsvParseRows (string [, row])
  • d3.tsvFormat (hàng [, cột])
  • d3.tsvFormatRows(rows)

Hãy để chúng tôi đi qua từng phương thức API này một cách chi tiết.

d3.csvParse (string [, row])

Phương pháp này được sử dụng để phân tích cú pháp định dạng csv. Xem xét tệpdata.csv được hiển thị bên dưới.

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

Bây giờ, chúng ta có thể áp dụng hàm đã cho ở trên.

Example - Chúng ta hãy xem xét ví dụ sau.

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

Ở đây, nó Phân tích chuỗi được chỉ định trong các giá trị được phân tách bằng dấu phân cách. Nó trả về một mảng các đối tượng đại diện cho các hàng được phân tích cú pháp.

d3.csvParseRows (string [, row])

Phương pháp này được sử dụng để phân tích cú pháp định dạng csv tương đương với các hàng.

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],
   };
});

Nó phân tích cú pháp từng hàng trong tệp csv.

d3.csvFormat (hàng [, cột])

Phương pháp này được sử dụng để định dạng các hàng và cột csv.

Example - Chúng ta hãy xem xét ví dụ sau.

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

Ở đây, nếu các cột không được chỉ định, danh sách các tên cột tạo thành hàng tiêu đề được xác định bởi sự kết hợp của tất cả các thuộc tính trên tất cả các đối tượng trong các hàng. Nếu các cột được chỉ định, nó là một mảng các chuỗi đại diện cho các tên cột.

d3.csvFormatRows (hàng)

Phương pháp này được sử dụng để định dạng các hàng csv.

Example - Chúng ta hãy xem xét ví dụ sau.

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

Ở đây, nó định dạng mảng các hàng chuỗi được chỉ định dưới dạng các giá trị được phân tách bằng dấu phân cách, trả về một chuỗi.

d3.tsvParse (string [, row])

Phương pháp này được sử dụng để phân tích cú pháp định dạng tsv. Nó tương tự như csvParse.

d3.tsvParseRows (string [, row])

Phương thức này được sử dụng để phân tích cú pháp định dạng tsv tương đương với các hàng. Nó tương tự như hàm csvParseRows.

d3.tsvFormat (hàng [, cột])

Phương pháp này được sử dụng để định dạng các hàng và cột tsv.

d3.tsvFormatRows (hàng)

Phương pháp này được sử dụng để định dạng các hàng tsv.