HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Lightstreamer Demo</title>
<script type="text/javascript" language="JavaScript" src="content/js/LS/lscommons.js"></script>
<script type="text/javascript" language="JavaScript" src="content/js/LS/lspushpage.js"></script>
<script src="http://www.google.com/jsapi?key=ABQIAAAABMEsCWm7ArCHaJ7EfNHyjRRfA77vZl8sU-2EUdQXl-flLnD-IBS9DtkAJQKD_YN4JmjL49vaqBS4eQ" type="text/javascript"></script>
</head>
<body>
<div id="chart_div"></div>
<div id="container"></div>
<script type="text/javascript">
function drawChart(chart, data) {
chart.draw(data, {widthx: 1600, height: 600, is3D: true, title: 'Stock data'});
}
function initApp() {
var page = new PushPage();
page.context.setDomain("woutm6300.nl");
page.onEngineCreation = function(engine) {
engine.connection.setLSHost("push.woutm6300.nl");
engine.connection.setLSPort("8081");
engine.connection.setAdapterName("STOCKLISTDEMO");
engine.changeStatus("STREAMING");
}
page.bind();
page.createEngine("Lightstreamer.Test", "content/js/LS", "SHARE_SESSION");
var schema = "last_price time pct_change bid_quantity bid ask ask_quantity min max ref_price open_price stock_name item_status";
var groupArray = new Array(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30);
var groupString = "";
var st = 1;
for (st = 1; st <= groupArray.length; st++) {
groupString += "item" + groupArray[st-1] + " ";
}
var data = new google.visualization.DataTable();
data.addColumn('string', 'Stockname');
data.addColumn('number', 'Last price');
data.addColumn('number', 'Min price');
data.addColumn('number', 'Max price');
data.addRows(groupArray.length);
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
drawChart(chart, data);
var pushtable = new NonVisualTable(groupString,schema,"MERGE");
pushtable.onItemUpdate = function(itemPos, updateInfo, itemName) {
if (updateInfo.isValueChanged(12)) {
var stock_name = updateInfo.getNewValue(12);// By field index because by field name 'stock_name' does NOT work (returns null)
var last_price = parseFloat(updateInfo.getNewValue(1));
var min_price = parseFloat(updateInfo.getNewValue(8));
var max_price = parseFloat(updateInfo.getNewValue(9));
document.getElementById("container").innerHTML +=
"Item update: "
+ "itemPos=" + itemPos
+ ", stock_name=" + stock_name
+ ", last_price=" + last_price
+ ", itemName=" + itemName
+ "<br/>";
data.setValue(itemPos - 1, 0, stock_name);
data.setValue(itemPos - 1, 1, last_price);
data.setValue(itemPos - 1, 2, min_price);
data.setValue(itemPos - 1, 3, max_price);
drawChart(chart, data);
}
}
page.addTable(pushtable, "1");
}
google.load("visualization", "1", {
packages:["barchart"]
});
google.setOnLoadCallback(function() {
// When google is loaded, initialize the rest of the application.
initApp();
});
</script>
</body>
</html>
Bookmarks