d3-fetch
这个模块基于Fetch之上添加了解析功能。例如加载一个 text 文件:
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"}, …]
});
这个模块内部支持Installing
使用NPM安装:npm install d3-fetch
. 下载latest release. 直接从d3js.org以standalone library的形式加载. 支持 AMD, CommonJS, 和 原始标签用法。使用原始方法时会全局暴露 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 Reference
d3.blob(input[, init]) <源码>
从指定的 input
URL 以 Blob 的形式获取二进制文件。如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。
d3.buffer(input[, init]) <源码>
从指定的 input
URL 以 ArrayBuffer 的形式获取二进制文件。如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。
d3.csv(input[, init][, row]) <源码>
等价于以逗号作为分隔符的 d3.dsv。
d3.dsv(delimiter, input[, init][, row]) <源码>
从指定的 input
URL 获取 DSV 文件。如果指定了 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]) <源码>
从指定的 input
URL 以 text 获取文件然后 parses it(将其转换为) HTML。如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。
d3.image(input[, init]) <源码>
从指定的 input
URL 获取图片。如果指定了 init 则表示可以在图片加载之前设置任何其他属性。例如如果要启用匿名 cross-origin request(跨域请求) 则需要执行以下操作:
d3.image("https://example.com/test.png", {crossOrigin: "anonymous"}).then(function(img) {
console.log(img);
});
d3.json(input[, init]) <源码>
从指定的 input
URL 获取 JSON 文件。如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。
d3.svg(input[, init]) <源码>
从指定的 input
URL 获取以text 获取文件然后 parses it(将其转换) 为 SVG。 如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。
d3.text(input[, init]) <源码>
从指定的 input
URL 获取 text 文件。如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。
d3.tsv(input[, init][, row]) <源码>
等价于以 tab 字符作为分隔符的 d3.dsv。
d3.xml(input[, init]) <源码>
从指定的 input
URL 获取以text 获取文件然后 parses it(将其转换) 为 XML。如果指定了 init 则会将其传递给底层的 fetch 方法;参考 RequestInit 获取允许的字段。