JSArray

Initial Data

As initial data we'll take sales information of some little company:

Year 2006 2007 2008 2009 2010
Sales 9.5 8.6 6.7 4.9 6.2

Configuration

In JSArray the data will look as:

salesData.js

[
	[ 9.5, "2006" ],
	[ 8.6, "2007" ],
	[ 6.7, "2008" ],
	[ 4.9, "2009" ],
	[ 6.2, "2010" ]
]

Data in JS array hasn’t got names for values. Values are accessible as (“data0”, “data1”, …)

HTML Code

chart(jsarray).html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<script src="../../../codebase/touchui.js" type="text/javascript"></script>
	<link rel="STYLESHEET" type="text/css" href="../../../codebase/touchui.css">
 
	<script>
var salesData = [
	          [ 9.5, "2006" ],
	          [ 8.6, "2007" ],
	          [ 6.7, "2008" ],
	          [ 4.9, "2009" ],
	          [ 6.2, "2010" ]
                ]
 
 
	window.onload=function(){
	dhx.ui({
	          container:"chart_container",
 		  view:"chart",
		  id:"salesPie",
		  type:"pie3D",
	   	  value:"#data0#",
		  label:"#data1#",
		  height:30
	})
	    $$('salesPie').parse(salesData, "jsarray")
	}
 
	</script>
 
</head>
<body>
	<div id="chart_container" style="width:450px;height:300px;border:0px solid #A4BED4;float:left;margin-right:20px"></div>
 
</body>
</html>

If you use data from external file - remove the method parse and add load, where specify the path to the desired data file.

window.onload=function(){
	dhx.ui({
	          container:"chart_container",
		  view:"chart",
	          id:"salesPie",
		  type:"pie3D",
	   	  value:"#data0#",
		  label:"#data1#",
		  height:30
	})
	    $$('salesPie').load("salesData.js","jsarray")
}