javascript - 如何同时使用 Express 和 & 符号？

Question

我正在创建一个 D3 应用程序，它将使用 Express 服务器和客户端的 & 符号来显示一些简单的数据。最终，我想将数据动态发送到浏览器，因为整个数据集可能会变得非常大。但目前，即使是最简单的事情我也很难做到。

我已经设置了一个简单的 Express 服务器，而且相当简单:

// Boilerplate express code 
var express = require('express'); 
var app = express(); 
var path = require('path'); 

// Make the Public directory available to the browser 
app.use(express.static(__dirname + '/public')); 

app.get('/', function(req, res) { 
  res.sendFile('d3.html', {'root': path.join(__dirname, '/views') }); 
}); 

// Listen on port 3000 
app.listen(3000); 

效果相当好。当我访问该页面时，它加载一个空白的 D3 条形图(仅轴)，但不显示任何数据。这是因为我还没有将数据发送到浏览器，而且据我了解，这需要使用 AJAX、jQuery 或其他方式来完成。我不知道如何继续。

这是在我的 d3.html 中；它从 data.tsv 读取数据，我已将其放置在 Express 服务器的 public 文件夹中:

d3.tsv("data.tsv", type, function(error, data) {
  x.domain(data.map(function(d) { return d.letter; }));
  y.domain([0, d3.max(data, function(d) { return d.frequency; })]);

这是data.tsv:

letter  frequency
A .08167
B .01492
C .02782
D .04253
E .12702
F .02288
G .02015
H .06094
I .06966
J .00153
K .00772
L .04025
M .02406
N .06749
O .07507
P .01929
Q .00095
R .05987
S .06327
T .09056
U .02758
V .00978
W .02360
X .00150
Y .01974
Z .00074

如何将数据传递到浏览器以便d3.html读取数据？我不在乎数据是否在 data.tsv 中；我只需要以某种方式发送等效数据。我不熟悉它，但我有一种预感，& 可以处理此数据的请求/接收，但我不确定如何处理。

Answer 1

您不需要在这个特定示例中使用＆符号，事实上，我根本不会在这个特定问题上使用它(我是＆符号作者)。

您想要做的是将 data.tsv 文件从服务器加载，并将数据放入 d3。通常，您将通过 ajax 请求从浏览器的服务器获取数据(如您所确定的)。事实上，d3 已经为您做到了这一点。您调用的 d3.tsv 函数正在尝试从服务器加载 data.tsv 文件并为您解析它。

现在，由于某种原因，这显然不适合你，所以需要注意的是:

1. 如果您访问http://localhost:3000/data.tsv ，你能在浏览器中看到数据吗？这会检查您是否具有 Express + Express 静态设置来正确提供数据。

2. 如果您打开 d3.html 页面并打开浏览器开发人员工具，您是否会看到任何错误？

3. 此代码是您从服务器获取数据并解析它的地方。尝试将错误记录到控制台并检查开发人员工具日志以查看是否存在错误。也许 d3 正在努力获取或解析数据？您也可以记录数据并查看此时它是否正确:

   d3.tsv("data.tsv", type, function(error, data) {
     console.log("The error is:", error); //add these
     console.log("The data is:", error);  //two lines
     x.domain(data.map(function(d) { return d.letter; }));
     y.domain([0, d3.max(data, function(d) { return d.frequency; })]);
   

4. 除此之外，您还需要发布更多 d3 代码，以帮助人们了解发生了什么以及您没有获取数据的原因。您甚至可能希望将其标记为 d3 问题，并从标题中删除 & 符号，因为它可能与您的问题无关。

旁注:很抱歉与符号网站没有帮助。这些事情总是可以变得更好吧？ :)