4

我坚持以下事情。我没有正在运行的本地 http 服务，所以我想以其他方式处理我的文件加载。

首先，我创建了以下函数，正如一些参考资料中所建议的那样。

var fileArray = [];
function readSingleFile(evt) {
    //Retrieve the first (and only!) File from the FileList object
    var f = evt.target.files;
        window.array = []
        if (f) {
            var r = new FileReader();
                r.onload = function(e) { 
                var contents = e.target.result;
                window.array.push(contents);
                fileArray.push({name:f.name, contents: contents});
                }
                r.readAsText(f);
                console.log(fileArray);
                } else { 
                    alert("Failed to load file");
                }
            }
            document.getElementById('fileinput').addEventListener('change', readSingleFile, false);

然后我尝试在 d3.csv 函数中调用 fileArray。但这就是我坚持的地方 - 控制台日志只显示一个空数组。

var dataset = []
                    d3.csv(fileArray, function(data) {
                    dataset = data.map(function(d) { return [ d["TEXT"], +d["HOURS"], +d["MONTH_DIGIT"] ]; });
                    console.log(dataset)
                });

.csv 文件具有以下结构。

"TEXT","HOURS","MONTH_DIGIT"
"Adjustments work",849.45,"01"

如何准确调用该文件以使用 d3.js？

4

2 回答 2

2

如果您想“获取文件及其内容并使用它”，您可以d3.csv()在回调之后在方法内加载文件并将您想要对内容进行的更改应用。

d3.csv('/path/to/myfile.csv, function(data) {
    // Modify the files data
    ...
    // Do something with d3.js
});
于 2013-08-12T14:36:13.953 回答
2

对于 JSON：

var data = JSON.parse(JavascriptStringVariableThatContainsJSON);

对于 CSV：

 var data = d3.csv.parseRows(JavascriptStringVariableThatContainsMyCSVdata);

//然后将数据添加到图形并调用回车，例如：

 var dataEnter = svg.selectAll("rect").data(data).enter();
于 2014-08-07T18:32:55.987 回答