by Observable

外觀

d3-fetch ​

此模組在 Fetch 的基礎上提供便利的剖析。例如，載入文字檔

js
const text = await d3.text("hello-world.txt"); // "Hello, world!"

載入並剖析 CSV 檔

js
const data = await d3.csv("hello-world.csv"); // [{"Hello": "world"}, …]

此模組內建支援剖析 JSON、CSV 和 TSV。你可以使用 text 直接剖析其他格式。（此模組取代了 d3-request。）

blob(input, init) ​

js
const blob = await d3.blob("example.db");

原始碼 · 以 Blob 形式擷取指定的 input URL 中的二進位檔案。如果指定了 init，則會將其傳遞給 fetch 的基礎呼叫；請參閱 RequestInit 以了解允許的欄位。

buffer(input, init) ​

js
const buffer = await d3.buffer("example.db");

原始碼 · 以 ArrayBuffer 形式擷取指定的 input URL 中的二進位檔案。如果指定了 init，則會將其傳遞給 fetch 的基礎呼叫；請參閱 RequestInit 以了解允許的欄位。

csv(input, init, row) ​

js
const data = await d3.csv("example.csv");

來源 · 等同於 d3.dsv，但分隔符號為逗號。

dsv(delimiter, input, init, row) ​

js
const data = await d3.dsv(",", "example.csv");

來源 · 從指定的 input URL 擷取 DSV 檔案。如果指定了 init，它會傳遞給 fetch 的底層呼叫；請參閱 RequestInit 以了解允許的欄位。可以指定一個選用的 row 轉換函式，以將列物件對應並篩選為更具體的表示形式；請參閱 dsv.parse 以了解詳情。例如

js
const data = await d3.dsv(",", "example.csv", (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
  };
});

如果只指定了 init 和 row 其中之一，則會將其解釋為 row 轉換函式（如果它是一個函式），否則會將其解釋為一個 init 物件。另請參閱 d3.csv 和 d3.tsv。

html(input, init) ​

js
const document = await d3.html("example.html");

來源 · 以 text 形式擷取指定 input URL 的檔案，然後將其 解析 為 HTML。如果指定了 init，它會傳遞給 fetch 的底層呼叫；請參閱 RequestInit 以了解允許的欄位。

image(input, init) ​

js
const image = await d3.image("example.png");

來源 · 擷取指定 input URL 的影像。如果指定了 init，則會在載入之前設定影像上的任何其他屬性。例如，要啟用匿名 跨來源請求

js
const image = await d3.image("https://example.com/image.png", {crossOrigin: "anonymous"});

json(輸入, 初始化) ​

js
const data = await d3.json("example.json");

來源 · 擷取指定 輸入 URL 的 JSON 檔案。如果指定 初始化，則會傳遞給 fetch 的基礎呼叫；請參閱 RequestInit 以取得允許的欄位。如果伺服器傳回 204 無內容 或 205 重設內容 的狀態碼，則承諾會解析為 undefined。

svg(輸入, 初始化) ​

js
const document = await d3.svg("example.svg");

來源 · 以 文字 擷取指定 輸入 URL 的檔案，然後以 SVG 解析。如果指定 初始化，則會傳遞給 fetch 的基礎呼叫；請參閱 RequestInit 以取得允許的欄位。

text(輸入, 初始化) ​

js
const text = await d3.text("example.txt");

來源 · 擷取指定 輸入 URL 的文字檔案。如果指定 初始化，則會傳遞給 fetch 的基礎呼叫；請參閱 RequestInit 以取得允許的欄位。

tsv(輸入, 初始化, 列) ​

js
const data = await d3.tsv("example.tsv");

來源 · 等同於 d3.dsv，但分隔符號為 tab 字元。

xml(輸入, 初始化) ​

js
const document = await d3.xml("example.xml");

來源 · 以 文字 擷取指定 輸入 URL 的檔案，然後以 XML 解析。如果指定 初始化，則會傳遞給 fetch 的基礎呼叫；請參閱 RequestInit 以取得允許的欄位。