Question

我正在学习d3，我正在尝试从CSV文件导入数据，但我不断收到错误“XMLHttpRequest无法加载文件：///Users/Laura/Desktop/SampleECG.csv。交叉起源请求仅支持HTTP。“我已经搜索了如何修复此错误并在本地Web服务器上运行它，但我找不到适用于d3.v2.js的解决方案。以下是代码示例：

var Time = []
    ECG1 = []

d3.csv("/Desktop/d3Project/Sample.csv", function(data) 
      {
      Time = data.map(function(d) {return [+d["Time"]];});
      ECG1 = data.map(function(d) {return [+d["ECG1"]];});
      console.log(Time)
      console.log(ECG1)
      });

非常感谢任何帮助。

Answer 1

这也使我感到困惑（我也是d3初学者）。

因此，出于某种原因，Web浏览器不满意您加载本地数据，可能是出于安全原因或其他原因。无论如何，要解决这个问题，您必须运行本地Web服务器。这很容易。

在您的终端中，在cd之后 - 访问您网站的文档根目录（感谢@daixtr），输入：

python -m SimpleHTTPServer 8888 &

好的，现在只要该终端窗口打开并运行，您的本地8888 Web服务器就会运行。

所以在我的情况下，最初我正在处理的网页被称为

file://localhost/Users/hills/Desktop/website/visualizing-us-bls-data-inflation-and-prices.html

当我用铬打开它时。要在我的本地Web服务器上打开我的页面，我只需键入（在chrome搜索栏中）：

http://localhost:8888/Desktop/website/visualizing-us-bls-data-inflation-and-prices.html

现在，阅读CSV应该有效。很奇怪，我知道。

Answer 2

对于那些使用内置python webserver并且仍然遇到问题的人，请记住并确保运行＆＃34; python -m SimpleHTTPServer 8888＆＃34;在您认为是DocumentRoot的正确路径上调用。也就是说，你不能只运行＆＃39; python -m SimpleHTTPServer 8888＆＃39;任何地方。你必须实际上＆cd; / to / correct / path /＆＃39;包含你的index.html或data.tsv，然后从那里运行＆＃39; python -m SimpleHTTPServer 8888＆＃39;。

Answer 3

此外，只需学习D3即可完成学校作业。我试图运行这个简单的D3示例： https://gist.github.com/d3noob/b3ff6ae1c120eea654b5

我遇到了与OP re相同的问题：使用Chrome浏览器加载数据。我敢打赌，上面发布的Hillary Sanders很棒的解决方案是： Python 2.X 。

我的回答是： Python 3.X [OS：Ubuntu 16x]：

在项目的根目录中打开一个终端窗口，然后运行：

python3 -m http.server

默认情况下，它将在端口8000上提供HTTP服务，除非已被使用，在这种情况下将打开另一个端口，例如7800，运行：

python3 -m http.server 7800

然后，在您的Chrome浏览器地址栏上输入：

localhost:8000

以上内容对我有用，因为我的根文件夹中只有一个index.html页面。如果您有一个其他名称的HTML页面，请键入该本地HTML页面的完整路径，它也应该起作用。并且，您应该能够看到从我的链接中的数据集创建的图形（该图形必须位于data / data.csv之类的文件夹中）。我希望这有帮助。：-）

Answer 4

使用Firefox，idk Chrome尝试完成的内容

无法从d3中的csv文件导入数据

4 个答案: