2015-08-20 53 views
1

我正在嘗試使用節點模塊dc線圖來繪製折線圖。 它對我的錯誤從D3錯誤。我正在使用dc.js版本2.0.0-beta17。Dc.js lineChart失敗

c:\projects\xxx\node_modules\dc\node_modules\d3\d3.js:1308 
    d3_behavior_zoomWheel = "onwheel" in d3_document ? (d3_behavior_zoomDelt 
            ^
TypeError: Cannot use 'in' operator to search for 'onwheel' in undefined 
    at Object.d3.behavior.zoom (c:\projects\xxx\node_modules\dc\node_modules\d3\d3.js:1308:44) 
    at Object.dc.coordinateGridMixin (c:\projects\xxx\node_modules\dc\dc.js:2085:29) 
    at Object.dc.lineChart (c:\projects\xxx\node_modules\dc\dc.js:4615:35) 

示例代碼

var dc = require('dc'); 
.. 
var data = [ 
    {date: "12/27/2012", http_404: 2, http_200: 190, http_302: 100}, 
    {date: "12/28/2012", http_404: 2, http_200: 10, http_302: 100}, 
    {date: "12/29/2012", http_404: 1, http_200: 300, http_302: 200}, 
    {date: "12/30/2012", http_404: 2, http_200: 90, http_302: 0}, 
    {date: "12/31/2012", http_404: 2, http_200: 90, http_302: 0}, 
    {date: "01/01/2013", http_404: 2, http_200: 90, http_302: 0}, 
    {date: "01/02/2013", http_404: 1, http_200: 10, http_302: 1}, 
    {date: "01/03/2013", http_404: 2, http_200: 90, http_302: 0}, 
    {date: "01/04/2013", http_404: 2, http_200: 90, http_302: 0}, 
    {date: "01/05/2013", http_404: 2, http_200: 90, http_302: 0}, 
    {date: "01/06/2013", http_404: 2, http_200: 200, http_302: 1}, 
    {date: "01/07/2013", http_404: 1, http_200: 200, http_302: 100} 
    ]; 

var ndx = crossfilter(data); 
data.forEach(function (d) { 
    d.date = d3.time.format("%m/%d/%Y").parse(d.date); 
    d.total= d.http_404+d.http_200+d.http_302; 
}); 


var dateDim = ndx.dimension(function(d) {return d.date;}); 
var hits = dateDim.group().reduceSum(function(d) {return d.total;}); 

var minDate = dateDim.bottom(1)[0].date; 
var maxDate = dateDim.top(1)[0].date; 


var gitLineChart = dc.lineChart("#test"); 

任何幫助表示讚賞。謝謝。

回答

1

在您的最後一行代碼中,您引用的是DOM Id #test,DC將在DOM中進行搜索。

但與網頁瀏覽器不同,NodeJS本身不提供DOM。這將解釋錯誤消息(d3_document未定義)。

你應該看看D3文檔:https://github.com/mbostock/d3/wiki#browser--platform-support

D3也運行在Node.js的使用npm install d3來安裝它。

注意,由於節點本身缺乏一個DOM和多個DOM 實現它(例如,JSDOM)存在,你需要明確 傳遞一個DOM元素,以你的D3方法如下所示: ...