d3.js queue.js和node.js

我想在nodejs中加载数据，然后传递给expressjs在浏览器中渲染d3图表。

我知道我可以从这里加载数据 – https://github.com/mbostock/queue

我有一个expressjs路由configuration像这样 –

var d3 = require('d3') ,queue = require("queue-async") ; router.get('/', handler1); function handler1(req, res) { queue() .defer(d3.json, 'https://data.medicare.gov/resource/a8s4-5eya.json?$limit=50000&$$app_token=igGS35vW9GvDMmJUnmHju2MEH&$select=org_pac_id%20as%20source, org_pac_id%20as%20target,org_lgl_nm%20as%20description') .defer(d3.json, 'https://data.medicare.gov/resource/a8s4-5eya.json?$limit=50000&$$app_token=igGS35vW9GvDMmJUnmHju2MEH&$select=org_pac_id%20as%20source, org_pac_id||pri_spec%20as%20target, pri_spec%20as%20description') .defer(d3.json, 'https://data.medicare.gov/resource/a8s4-5eya.json?$limit=50000&$$app_token=igGS35vW9GvDMmJUnmHju2MEH&$select=org_pac_id||pri_spec%20as%20tsource, pri_spec%20as%20target, frst_nm%20as%20description') .await(go); function go(error, data,d2,d3){ data.concat(d2); data.concat(d3); console.log(data); res.render('index', { title: 'Group Practices', data }); } } module.exports = router; 

但是，我得到一个浏览器错误，

 XMLHttpRequest is not defined ReferenceError: XMLHttpRequest is not defined at d3_xhr (/Users/Admin/Public/GroupPractice/node_modules/d3/d3.js:1934:114) at d3.json (/Users/Admin/Public/GroupPractice/node_modules/d3/d3.js:9533:12) at pop (/Users/Admin/Public/GroupPractice/node_modules/queue-async/queue.js:24:14) at Object.q.defer (/Users/Admin/Public/GroupPractice/node_modules/queue-async/queue.js:55:11) at handler1 (/Users/Admin/Public/GroupPractice/routes/index.js:18:5) at Layer.handle [as handle_request] (/Users/Admin/Public/GroupPractice/node_modules/express/lib/router/layer.js:95:5) at next (/Users/Admin/Public/GroupPractice/node_modules/express/lib/router/route.js:131:13) at Route.dispatch (/Users/Admin/Public/GroupPractice/node_modules/express/lib/router/route.js:112:3) at Layer.handle [as handle_request] (/Users/Admin/Public/GroupPractice/node_modules/express/lib/router/layer.js:95:5) at /Users/Admin/Public/GroupPractice/node_modules/express/lib/router/index.js:277:22 

我如何使用d3和队列预先加载这个RESTful数据？

Answer 1

d3库是客户端的。 这意味着它必须在浏览器中使用，而不是在服务器端应用程序中使用。

如果您想要在Express应用程序中获取数据并将其连接起来，可以使用如下所述的asynchronous和请求 ：

 var request = require('request'); var async = require('async'); function createRequestTask(url) { return function(callback) { request({ url: url, json: true }, function (err, response, body) { callback(err, body); }); }; } async.parallel([ // URL #1 createRequestTask('https://data.medicare.gov/resource/a8s4-5eya.json?$limit=50000&$$app_token=igGS35vW9GvDMmJUnmHju2MEH&$select=org_pac_id%20as%20source, org_pac_id%20as%20target,org_lgl_nm%20as%20description'), // URL #2 createRequestTask('https://data.medicare.gov/resource/a8s4-5eya.json?$limit=50000&$$app_token=igGS35vW9GvDMmJUnmHju2MEH&$select=org_pac_id%20as%20source, org_pac_id%20as%20target,org_lgl_nm%20as%20description'), (...) ], function(err, results) { // Result contains an array with each request result }); 

请求将并行执行，当所有请求完成时，最后的callback被调用。 resultsvariables将包含一个包含所有响应内容的数组。

然后，您可以利用此数组来构build您希望快速路由返回的对象。

这里是你的代码的更新：

 router.get('/', handler1); function handler1(req, res) { async.parallel([ // URL #1 createRequestTask('https://data.medicare.gov/...'), // URL #2 createRequestTask('https://data.medicare.gov/...'), (...) ], function(err, results) { res.render('index', { title: 'Group Practices', results }); }); } module.exports = router; 

希望它能帮助你，Thierry

Answer 2

我通过使用xmlhttprequest npm软件包解决了这个问题，然后在我的node_modules文件夹的d3.js文件中，我在第1934行添加了d3_xhr函数的定义。

 var XMLHttpRequest = require('xmlhttprequest').XMLHttpRequest; 

这样我的d3总是可以在我工作的时候进行xhr请求。 我希望更多的人能够find这个，因为这是一个超级容易的解决scheme，并不是很多人似乎想要做的，以克服在节点中缺乏内置的xhr支持。