我们如何使用 d3 将 CSV 文件加载到 JupyterLab 中？ [复制]答案

【问题标题】：How can we load a CSV file into JupyterLab using d3? [duplicate]我们如何使用 d3 将 CSV 文件加载到 JupyterLab 中？ [复制]
【发布时间】：2021-10-07 02:01:58
【问题描述】：

我找不到在 JupyterLab 中运行 d3 的直接方法，但是当我以这种方式加载它时：

%%html
<script src="https://d3js.org/d3.v7.min.js"></script>

这行得通：

%%javascript
d3.select(element)
    .append("text")
    .text("Hello World!");

Hello World!

现在我正在尝试加载这样的 CSV 文件：

Name,Count
A,10
B,15
C,14

为此，我运行这个：

%%javascript
d3.csv("df.csv", function(data){
    console.log(data);
});

这不起作用，输出是这样的：

使用 d3 将 CSV 加载到 JupyterLab 的正确方法是什么？

【问题讨论】：

标签： javascript d3.js jupyter-notebook jupyter jupyter-lab

【解决方案1】：

这是一个静态文件，因此为了加载它，您需要使用一个端点，该端点将文件作为原始文本/blob 提供服务，即files/。它需要一个相对于 jupyter 服务器根目录的路径（这是您启动 JupyterLab 的目录）。例如，如果您在根目录中有 df.csv，并且 JupyterLab 的 URL 如下所示：

http://localhost:8889/lab/tree/Untitled.ipynb

你想使用：

http://localhost:8888/files/df.csv

【讨论】：