首页 > 解决方案 > 未捕获的 ReferenceError:在 d3.js 中加载 .csv 文件时未定义数据

问题描述

我正在尝试使用存储在 .csv 文件中的数据制作一个简单的散点图。我尝试关注 此资源,但收到以下错误:

(index):35 Uncaught ReferenceError: data is not defined at (index):35

这是代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>TEST</title>
    <script src="https://d3js.org/d3.v5.min.js">></script>
    <script src="https://d3js.org/d3-dsv.v1.min.js"></script>
    <script src="https://d3js.org/d3-fetch.v1.min.js"></script>
    <style>
        .main {
            font-size: xx-large;
        }</style>
</head>
<body>

<h1>Resultater</h1>
<div>data here: </div>
</body>


<script>
d3.csv("cool.csv").then(function(data) {
  console.log(data);
});


    let w = 800;
    let h = 800;

    let svg = d3.select('body')
        .append('svg')
        .attr('width', w)
        .attr('height', h);

    let bib = d3.selectAll('circle')
        .data(data)
        .enter()
            .append('circle')
            .attr('cx', function(d) { return d.FINISH * 2; })
            .attr('cy', 300)
            .attr('r', 40);
</script>


</html>


有人可以帮我理解为什么我会收到这个错误吗?

最佳,克里斯蒂安·马格尔森

标签: javascriptd3.js

解决方案


推荐阅读