Realtime Donut Chart
D3 powered donut or pie chart that updates when it receives information from the PubNub data stream network. Great for comparing percentage values against one another.
Embed
var pubnub = new PubNub({
publishKey: 'demo',
subscribeKey: 'demo'
});
eon.chart({
pubnub: pubnub,
channels: ['donut-chart'],
generate: {
bindto: '#chart',
data: {
labels: true,
type: 'donut'
}
}
});Publish
var pubnub = new PubNub({
publishKey: 'demo',
subscribeKey: 'demo'
});
setInterval(function(){
pubnub.publish({
channel: 'donut-chart',
message: {
eon: {
'Austin': Math.floor(Math.random() * 99),
'New York', Math.floor(Math.random() * 99),
'San Francisco', Math.floor(Math.random() * 99),
'Portland', Math.floor(Math.random() * 99)
}
}
});
}, 1000);