javascript - 我可以通过哪种方式将 CSV 文件发送到某个地方然后进行一些处理然后返回 json 数据？

Question

我正在做 dc.js 可视化数据和 d3-force-layout。 dc.js 基于d3 和crossfilter，dc 可以处理csv 文件作为输入文件，但d3-force-layout 只能将json 文件作为输入文件。所以我想将 CSV 文件发送到某个地方，使用 java 程序将 csv 文件转换为 json 文件，然后将其发回以使用 d3-force 布局。我试过 php 和 javaEE 来构建网页。但是在apache服务器和tomcat服务器上无法加载d3.js和dc.js。 enter image description here

        <script src="JS/jquery-3.2.1.min.js" type="text/javascript"></script>
    <script src="JS/crossfilter-master/crossfilter.js" type="text/javascript"></script>         
    <script src="JS/d3-3.5.17/d3.js" type="text/javascript"></script>
    <script src="JS/dc.js-2.0.2/dc.js" type="text/javascript"></script>
    <script src="JS/d3-queue/d3-queue.js" type="text/javascript"></script>

这是我加载 js 库的代码。这是 JS 发送请求。

$('#files').change(function(){
var q = d3.queue();
var fileNames = "";
for(var i = 0; i < this.files.length; i++){
    fileNames += ", " + this.files[i].name;
    q.defer(d3.csv, this.files[i].name);
}
q.awaitAll(drawDC);
$.get("http://localhost:8080/Charting/ChartingServlet?files="+fileNames, drawForceLayout);
// drawForceLayout('data.json');
$("#fileNames").html('');
if(this.files.length > 1)
    $("#fileNames").html(fileNames.substring(2));
});

function drawForceLayout(jsonFile){
    //start to draw
}

我还制作了一个 servlet 来处理获取文件的请求，将其转换为 json 并将其发回。

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    if(request.getParameterMap().containsKey("files")) {
        String files = request.getParameter("files");
        System.out.println(files.toString());

        ////call the java program to convert CSV files to json then sent the file name or the content back.

        response.setHeader("Content-type", "text/html;charset=UTF-8");
        response.getWriter().append("data.json");
    }
}

This is the Tomcat serverindex.html 是主页。

我的问题是如何实现这一点，我是否对这些服务器做错了什么？

Answer 1

看看这个 block :https://bl.ocks.org/mbostock/2949937 .您将看到正在运行的 d3.csv 函数。