與D3

實時數據我想知道如果我可以使用D3庫的實時數據我的服務器將通過網頁套接字來發送。我看不到任何證明這一點的文檔或例子。我最初的期望是由下面的示例代碼從這樣做：與D3

ws = new WebSocket(ws://localhost:8888/ma"); 
some more code.... 

    ws.onmessage = function(evt) { 
     d3.json("evt.data", function(json) { 
......  
.......More code..... 
...... 
} 
}

但是這似乎並沒有工作，但我知道客戶端通過檢查控制檯日誌接收數據。

此外，還有一個遞歸函數，它變平JSON文檔：

// Returns a flattened hierarchy containing all leaf nodes under the root. 
function classes(root) { 
var classes = []; 

function recurse(name, node) { 
    if (node.children) node.children.forEach(function(child) { recurse(node.name, child); }); 
    else classes.push({packageName: name, className: node.name, value: node.size}); 
    } 

    recurse(null, root); 
    return {children: classes}; 
} 

    console.log(evt.data); 
    }; 

    ws.onclose = function (evt) { 
     alert("Connection terminated")}; 

    }); 
});

如果我的JSON文檔是平已經那麼我相信它不會被要求即：

{ID: 1, Name: 'my name', age: 65, car: 'Ford'}

D3對我來說是完全新的，所以幫助將不勝感激。

感謝

來源

2012-12-02 user94628

你能重新格式化代碼嗎？第二個代碼塊是沒有意義的我... – filmor

相關：http://stackoverflow.com/questions/13591891/d3-bubble-chart-not-rendering-in-real-time-through-web-socket – rosshamish

@filmor那函數來自D3代碼示例：https：//github.com/mbostock/d3/blob/master/examples/bubble/bubble.js。如果原始的JSON文檔是嵌套的，我認爲它用於「平整」出JSON結構。 – user94628

我沒有使用D3（還）的WebSockets，但它看起來像你期望d3.json是一個JSON解析器。它不是 - 這是一個AJAX加載器，它代表JSON.parse進行解析。所以你可能想要像這樣的東西：

var ws = new WebSocket("ws://localhost:8888/ma"); 

var data = []; 

ws.onmessage = function(evt) { 
    // append new data from the socket 
    data.push(JSON.parse(evt.data)); 
    update(); 
}; 

// now use the standard join pattern to deal with updates 
function update() { 
    var chunk = d3.selectAll('p') 
     .data(data); 

    // entry might be all you need, if you're always appending 
    chunk.enter().append('p') 
     .text(function(d) { return d; }); 

}

來源

2012-12-04 00:51:12 nrabinowitz

謝謝，我會看看這個，明天早上試試看。 – user94628

回答

相關問題