# d3请求
算是基于fetch，然后更细化到每个具体的操作，d3.xhr函数已经被v4版本移除
npm install d3-fetch
# d3.csv d3.tsv(制表符)
将csv文件直接解析成需要的样式
a,b,c
sj_mino1001.jpg,715282,4FB55FE8
sj_mino1002.jpg,471289,93203C5C
sj_mino1003.jpg,451929,C4E80467
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content=
"width=device-width, initial-scale=1.0">
</head>
<body>
<div>demo</div>
<!-- Fetching from CDN of D3.js -->
<script type="text/javascript"
src="https://d3js.org/d3.v6.min.js">
</script>
<script>
console.log(d3.csv)
//这是v3v4版本的写法
// d3.csv("demo.csv",function(err,json){
// console.log(json)
// })
//v5v6版本写法(或者把上面的err,json改成一个参数，返回值就是需要要的值)
d3.csv("demo.csv")
.then(res=>{
console.log(res)
})
/*0: {a: "sj_mino1001.jpg", b: "715282", c: "4FB55FE8"}
1: {a: "sj_mino1002.jpg", b: "471289", c: "93203C5C"}
2: {a: "sj_mino1003.jpg", b: "451929", c: "C4E80467"}
columns: (3) ["a", "b", "c"]*/
// fetch("demo.csv").then(res=>res.text()).then(res=>{
// console.log(res)
// })
// function ajax(url){
// var xhr = window.XMLHttpRequest ? new XMLHttpRequest()
// : ActiveXObject("microsoft.XMLHttp")
// xhr.open("get",url,true);
// xhr.send();
// xhr.onreadystatechange = () =>{
// if(xhr.readyState == 4){
// if(xhr.status == 200){
// console.log(xhr)
// var data = xhr.responseText;
// console.log(data)
// return data;
// }
// }
// }
// }
// ajax("demo.csv")
</script>
</body>
</html>
注意：使用v5v6版本时，在csv请求的第二个参数写函数是，会给出每条数据的值，而写在then之中则是全体数据组成的数组！
# d3.html
请求一个HTML文档片段
# d3.json
请求一个JSON对象
d3.json("demo.json").then(res=>{
console.log(res)
})