Realtime Bar Chart
D3 powered bar chart that updates when it receives pings from the PubNub data stream network. Works best when comparing values to one another.
Embed
var pubnub = new PubNub({
publishKey: 'demo',
subscribeKey: 'demo'
});
eon.chart({
pubnub: pubnub,
channels: ['eon-bar'],
generate: {
bindto: '#chart',
data: {
labels: true,
type: 'bar'
},
bar: {
width: {
ratio: 0.5
}
},
tooltip: {
show: false
}
}
});Publish
var pubnub = new PubNub({
publishKey: 'demo',
subscribeKey: 'demo'
});
setInterval(function(){
pubnub.publish({
channel: channel,
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);