时间戳

首页 > 解决方案 > 我们如何使用 d3 将 CSV 文件加载到 JupyterLab 中？

javascript - 我们如何使用 d3 将 CSV 文件加载到 JupyterLab 中？

问题描述

我找不到在 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 的正确方法是什么？

标签： javascriptd3.jsjupyter-notebookjupyterjupyter-lab

解决方案

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

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

你想使用：

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

推荐阅读