关于在node.js中服务html和绘图的问题

当node.js服务包含svg绘图的html文件时，我遇到了一个问题。关于在node.js中服务html和绘图的问题

中的index.html包含图表是等同于线图在http://bl.ocks.org/mbostock/3883245

的问题是，每当我服通快递服务器中的index.html，我得到一个空白页。（在127.0空白页.0.1：80）但是，如果我在本地打开index.html文件，则会出现折线图。（页正常工作在file：/// F：/d3/index.html）

main.js源码：

var app = require('express')(); 
var server = require('http').Server(app); 
var fs = require('fs'); 

app.get('/', function(req, res){     
    var index = fs.readFileSync(__dirname + '/index.html', "utf8"); 
    res.writeHead(200, {"Content-Type": "text/html"}); 
    res.write(index); 
    res.end(); 
}); 

server.listen(80);

图表由D3绘制。

来源

2015-02-11 user3654736

你确定你的d3库正在被你的浏览器加载吗？ – 2015-02-11 11:55:50

是的。我确定。我双击F：\ d3 \ index.html并出现图表。但浏览器在通过nodejs web服务器（127.0.0.1或localhost） – user3654736 2015-02-11 14:01:02

访问时没有显示任何内容。您显然不理解我的评论。你怎么确定当你运行节点时d3.js被加载？ – 2015-02-11 14:03:43

我终于解决了这个问题。 node.js的服务器功能非常基础。与IIS或Apache不同，节点不具有Web服务器的概念。每个文件请求都需要手动处理。

var app = require('express')(); 
var server = require('http').Server(app); 
var fs = require('fs'); 

//load d3 for index.html 
app.get('/d3/d3.js', function(req, res){ 
    var d3 = fs.readFileSync(__dirname + '/d3/d3.js', "utf8"); 
    res.writeHead(200, {"Content-Type": "application/javascript"}); 
    res.write(d3); 
    res.end(); 
}); 

//load chart data for d3 
app.get('/data.tsv', function(req, res){ 
    fs.readFile(__dirname + '/data.tsv', 'utf8', function(err, data){ 
     if (err){ 
      console.log(err); 
     }else{ 
      console.log("data req received.") 
      res.writeHead(200, {"Content-Type": "text/plain"}); 
      res.write(data); 
      res.end(); 
     } 
    }); 
}); 

app.get('/', function(req, res){ 
    res.sendFile(__dirname + '/index.html'); 
}); 

server.listen(80);

D3图表绘制成功显示。

来源

2015-02-12 05:45:32 user3654736

关于在node.js中服务html和绘图的问题

回答

相关问题