对于以下数据，
historicalBarChart = [
{
key: "Cumulative Return",
values: [
{
"label" : "A" ,
"value" : 29.765957771107
} ,
{
"label" : "B" ,
"value" : 0
} ,
{
"label" : "C" ,
"value" : 32.807804682612
} ,
{
"label" : "D" ,
"value" : 196.45946739256
} ,
{
"label" : "E" ,
"value" : 0.19434030906893
} ,
{
"label" : "F" ,
"value" : 98.079782601442
} ,
{
"label" : "G" ,
"value" : 13.925743130903
} ,
{
"label" : "H" ,
"value" : 5.1387322875705
}
]
}
];
我将使用 NVD3.js 和 Node js 服务器生成条形图。
我的 Nodejs 代码生成 svg : ** NVD3svgnode.js **
var http = require('http'),
url = require('url'),
jsdom = require('jsdom'),
child_proc = require('child_process'),
w = 400,
h = 400,
scripts = ["file://"+__dirname+"/d3.min.js",
"file://"+__dirname+"/d3.layout.min.js",
"file://"+__dirname+"/nv.d3.min.js",
"file://"+__dirname+"/bar.js"],
htmlStub = '<!DOCTYPE html><div id="bar" style="width:'+w+'px;height:'+h+'px;"><svg xmlns="http://www.w3.org/2000/svg" version="1.1"></svg></div>';
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'image/svg+xml'});
jsdom.env({features:{QuerySelector:true}, html:htmlStub, scripts:scripts, done:function(errors, window) {
var chart1= window.bar();
d3.select('#bar svg')
.datum(historicalBarChart)
.transition().duration(500)
.call(chart1);
}});
}).listen(8888);
我生成栏的 NVD3 代码是: bar.js
function bar(){
var chart = nv.models.discreteBarChart()
.x(function(d) { return d.label })
.y(function(d) { return d.value })
.staggerLabels(true)
.tooltips(false)
.showValues(true);
return chart;
}
在执行 Node js NVD3svgnode.js时，我收到以下异常
file:///Users/administrator/Downloads/nodejs/d3.js:5347
var t = g.transform.baseVal.consolidate();
^
**strong text**TypeError: Cannot read property 'baseVal' of undefined
at d3.transform (file:///Users/administrator/Downloads/nodejs/d3.js:5347:28)
at Object.d3.transform (file:///Users/administrator/Downloads/nodejs/d3.js:5350:7)
at d3_interpolateTransform (file:///Users/administrator/Downloads/nodejs/d3.js:5394:35)
at Object.<anonymous> (file:///Users/administrator/Downloads/nodejs/d3.js:7697:32)
at d3_Map.<anonymous> (file:///Users/administrator/Downloads/nodejs/d3.js:7858:31)
at d3_Map.d3_class.forEach (file:///Users/administrator/Downloads/nodejs/d3.js:271:13)
at start (file:///Users/administrator/Downloads/nodejs/d3.js:7857:28)
at Object.callback (file:///Users/administrator/Downloads/nodejs/d3.js:7851:38)
at d3_timer_mark (file:///Users/administrator/Downloads/nodejs/d3.js:2075:80)
at d3_timer_step [as _onTimeout] (file:///Users/administrator/Downloads/nodejs/d3.js:2048:15)
任何有关此问题的帮助都会很棒。
最佳答案
我建议您删除代码中的 transition().duration(500) 调用，我认为这在服务器端没有用(它是在服务器上执行的，而不是客户端上执行的，所以用户不会看到过渡)，并且您的堆栈跟踪引用了过渡效果，因此它可能会解决您的问题。
(我遇到了同样的问题并删除了我的转换修复了它)。
关于node.js - Node js、NVD3.js无法读取未定义的属性baseval，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18909990/