Hi. I have been using a Google org chart in my app for a few years. Here is the view that creates it. What is the easiest way to use this existing chart so that it appears in my KoolReport?
<head>
<title>Substantiator</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<html>
<head><br>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script>
google.charts.load('current', {packages:['orgchart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var jsonData = $.ajax({
type : "GET",
url: "<?php echo base_url(); ?>" + "index.php/Configure/snd_json",
dataType: "json",
// jsonp: false,
cache: false,
dataSrc: '',
success: function(jsonData)
{
// var jD = JQuery.parseJSON(jsonData);
var data = new google.visualization.DataTable();
data.addColumn('string', 'employee_email');
data.addColumn('string', 'manager_email');
data.addColumn('string', 'ToolTip');
for ( var i=0, ien=jsonData.length ; i<ien ; i++ ) {
var rowArr= [jsonData[i].employee_email,jsonData[i].manager_email,jsonData[i].employee_title];
data.addRow(rowArr);
}
var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
// Draw the chart, setting the allowHtml option to true for the tooltips.
chart.draw(data, {});
},
error:
function (jqXHR, textStatus, errorThrown) {
alert('error');
// Request failed. Show error message to user.
// errorThrown has error message, or "timeout" in case of timeout.
},
async: false,
timeout: 10000,
}).responseText;
}
</script>
</head>
<!--Div that will hold the pie chart-->
<br><br><br>
<div id="chart_div"></div>
</body>
</html>
