d3-fetch

Этот модуль предоставляет удобный парсер поверх Fetch. Например, для загрузки текстового файла:

d3.text("/path/to/file.txt").then(function(text) {
  console.log(text); // Hello, world!
});

Для загрузки и парсинга CSV-файла:

d3.csv("/path/to/file.csv").then(function(data) {
  console.log(data); // [{"Hello": "world"}, …]
});

Этот модуль имеет встроенную поддержку парсинга JSON, CSV и TSV. Вы можете парсить дополнительные форматы, используя text напрямую. (Этот модуль заменил d3-request.)

Установка

Если вы используете NPM, npm install d3-fetch. В противном случае, скачайте последнюю версию. Вы также можете загрузить напрямую с d3js.org как отдельную библиотеку. Поддерживаются среды AMD, CommonJS и vanilla. В vanilla, экспортируется глобальная переменная d3:

<script src="https://d3js.org/d3-dsv.v1.min.js"></script>
<script src="https://d3js.org/d3-fetch.v1.min.js"></script>
<script>

d3.csv("/path/to/file.csv").then(function(data) {
  console.log(data); // [{"Hello": "world"}, …]
});

</script>

Справочник API

d3.blob(input[, init]) Исходный код

Загружает бинарный файл по указанному URL input как Blob. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.

d3.buffer(input[, init]) Исходный код

Загружает бинарный файл по указанному URL input как ArrayBuffer. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.

d3.csv(input[, init][, row]) Исходный код

Эквивалентно d3.dsv с запятой в качестве разделителя.

d3.dsv(delimiter, input[, init][, row]) Исходный код

Загружает файл DSV по указанному URL input. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей. Можно указать необязательную функцию преобразования row для сопоставления и фильтрации объектов строк к более специфическому представлению; см. dsv.parse для подробностей. Например:

d3.dsv(",", "test.csv", function(d) {
  return {
    year: new Date(+d.Year, 0, 1), // convert "Year" column to Date
    make: d.Make,
    model: d.Model,
    length: +d.Length // convert "Length" column to number
  };
}).then(function(data) {
  console.log(data);
});

Если указан только один из init и row, он интерпретируется как функция преобразования row, если это функция, и иначе как объект init.

См. также d3.csv и d3.tsv.

d3.html(input[, init]) Исходный код

Загружает файл по указанному URL input как текст и затем парсит его как HTML. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.

d3.image(input[, init]) Исходный код

Загружает изображение по указанному URL input. Если указан init, устанавливает дополнительные свойства изображения перед загрузкой. Например, для включения анонимного кросс-доменного запроса:

d3.image("https://example.com/test.png", {crossOrigin: "anonymous"}).then(function(img) {
  console.log(img);
});

d3.json(input[, init]) Исходный код

Загружает JSON файл по указанному URL input. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.

d3.svg(input[, init]) Исходный код

Загружает файл по указанному URL input как текст и затем парсит его как SVG. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.

d3.text(input[, init]) Исходный код

Загружает текстовый файл по указанному URL input. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.

d3.tsv(input[, init][, row]) Исходный код

Эквивалентно d3.dsv с символом табуляции в качестве разделителя.

d3.xml(input[, init]) Исходный код

Загружает файл по указанному URL input как текст и затем парсит его как XML. Если указан init, он передаётся в вызов fetch; см. RequestInit для допустимых полей.