无法使用 HTML 中的 Java 脚本访问.csv文件

unable to access a .csv file using java script in html

本文关键字:脚本 访问 csv 文件 Java 中的 HTML      更新时间:2023-09-26

我正在尝试掌握d3.js以获得可视化数据表示,在那里提供的一个教程中,我尝试运行其中一个代码,该代码将.csv文件作为输入,然后使用所需的svg方法和Java脚本将其显示在网页上。

好吧,当我尝试运行下面的代码时,它没有成功。我在我的系统中安装了 xampp。我将 j3s.html 保存在 httpdocs 文件夹中,将.csv文件保留在同一文件夹中,但有些文件无法正常工作。

我对 Web 和 java 脚本完全陌生,但是是的,这段代码很容易理解。下面是代码。

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script>
</head>
<body>
    <div id="viz"></div>
    <script type="text/javascript">
d3.text("auto_mpg_tmp.csv", function(datasetText) {
var parsedCSV = d3.csv.parseRows(datasetText);
var sampleHTML = d3.select("#viz")
    .append("table")
    .style("border-collapse", "collapse")
    .style("border", "2px black solid")
    .selectAll("tr")
    .data(parsedCSV)
    .enter().append("tr")
    .selectAll("td")
    .data(function(d){return d;})
    .enter().append("td")
    .style("border", "1px black solid")
    .style("padding", "5px")
    .on("mouseover", function(){d3.select(this).style("background-color", "aliceblue")})
    .on("mouseout", function(){d3.select(this).style("background-color", "white")})
    .text(function(d){return d;})
    .style("font-size", "12px");
});
    </script>
</body>
</html>

好吧,我的 XAMPP 也有很多问题,我试图使用此链接解决它们。这是XAMPP服务器的错误日志。

4:17:41 PM  [Apache]    Error: Apache shutdown unexpectedly.
4:17:41 PM  [Apache]    This may be due to a blocked port, missing dependencies, 
4:17:41 PM  [Apache]    improper privileges, a crash, or a shutdown by another method.
4:17:41 PM  [Apache]    Press the Logs button to view error logs and check
4:17:41 PM  [Apache]    the Windows Event Viewer for more clues
4:17:41 PM  [Apache]    If you need more help, copy and post this
4:17:41 PM  [Apache]    entire log window on the forums

我不确定您的服务器堆栈有什么问题。 但是Javascript代码似乎很好。 我让它在 JSBin 上完好无损地运行

最简单的方法是使用 Python Web 服务器进行开发,而不是整个 XAMPP 堆栈。

确保已安装 Python。在包含顶级index.html(上面粘贴的内容)的目录中,只需执行以下操作:

python -m SimpleHTTPServer

这将启动一个迷你网络服务器,您可以通过在浏览器中输入以下内容来访问该服务器:

http://127.0.0.1:8000