This layout is used by the following built-in charts/reports and examples





Layout Script
var div = $("#chart");

if(chartData.columns.length == 0)
{
	$(div).append("<h4>"+chartData.empty.label.text+"</h4>");
} 
else 
{
	if(chartData.custom.title)
		$(div).append("<h4>"+chartData.custom.title+"</h4>");
	var table = d3.select("#chart").append('table')
	var thead = table.append('thead')
	var	tbody = table.append('tbody');
	
	$("#chart > table").addClass("table")
	thead.append('tr').selectAll('th').data(chartData.columns[1]).enter().append('th').text(function (column) { return column; });
	
	if ( chartData.ytype )
	{
		$('thead > tr > th:first').text(chartData.ytype + " \\ " + chartData.xtype)
	}
	else
	{
		$('thead > tr > th:first').text(chartData.xtype)
	}
	var tr = tbody.selectAll('tr').data(chartData.groups[0]).enter().append("tr");
	
	
	var td = tr.selectAll("td").data(function(d)
	{
	  var result = new Array();
		$.each(chartData.columns,function(index,value){
			if(value[0] == d){
	        result.push.apply(result,value);
	        }
	    });
		return result;
	}).enter().append("td").text(function(d,i)
	{
		return d;
	});
}

If you still have questions, feel free to refer to our support team.