The above example shows you how to create LineChart using D3 package. In this example, for purpose of chart demonstration only, we do use mock-up data from array. As you can see, the KoolReport's widget in general support dataSource could be DataStore, Process, DataSource or even simple array.
This example shows how to build a basic xy line chart.
<?php
if(session_status() !== PHP_SESSION_ACTIVE) session_start();
require_once "../../../../load.koolreport.php";
require_once "MyReport.php";
$report = new MyReport;
$report->run();
?>
<?php
if (isset($_POST['command'])) {
?>
<div id="report_render">
<?php
$report->render();
?>
</div>
<?php
exit;
}
?>
<?php
if (!isset($_POST['command'])) {
?>
<div id="report_render">
<?php
$report->render();
?>
</div>
<?php
}
?>
<script>
setTimeout(function() {
$.ajax({
type: "POST",
url: 'run.php',
data: {
command: "second"
},
success: function(response) {
$('#report_render').html(response);
},
});
}, 1000);
setTimeout(function() {
$.ajax({
type: "POST",
url: 'run.php',
data: {
command: "third"
},
success: function(response) {
$('#report_render').html(response);
},
});
}, 2000);
setTimeout(function() {
$.ajax({
type: "POST",
url: 'run.php',
data: {
command: "final"
},
success: function(response) {
$('#report_render').html(response);
},
});
}, 3000);
</script>
<?php
class MyReport extends \koolreport\KoolReport
{
}
<h1 class='title'>Simple XY Line Chart</h1>
<?php
$data = [
['x' => '30', 'data1' => 30, 'data2' => 130],
['x' => '50', 'data1' => 200, 'data2' => 300],
['x' => '100', 'data1' => 100, 'data2' => 200],
['x' => '230', 'data1' => 400, 'data2' => 300],
['x' => '300', 'data1' => 150, 'data2' => 250],
['x' => '310', 'data1' => 250, 'data2' => 450]
];
$series = array();
if (!isset($_POST['command'])) {
$_SESSION['data'] = $data;
$series = array('x' => array(
'type' => '',
'x' => 'x'
), 'data1', 'data2');
}
if (isset($_POST['command']) && $_POST['command'] === 'second') {
$data1 = [100, 250, 150, 200, 100, 350];
for ($i = 0; $i < count($_SESSION['data']); $i++) {
$_SESSION['data'][$i]['data1'] = $data1[$i];
}
$series = array('x' => array(
'type' => '',
'x' => 'x'
), 'data1', 'data2');
}
if (isset($_POST['command']) && $_POST['command'] === 'third') {
$data3 = [80, 150, 100, 180, 80, 150];
for ($i = 0; $i < count($_SESSION['data']); $i++) {
$_SESSION['data'][$i]['data3'] = $data3[$i];
}
$series = array('x' => array(
'type' => '',
'x' => 'x'
), 'data1', 'data2', 'data3');
}
if (isset($_POST['command']) && $_POST['command'] === 'final') {
for ($i = 0; $i < count($_SESSION['data']); $i++) {
array_splice($_SESSION['data'][$i], 2, 1);
}
$series = array('x' => array(
'type' => '',
'x' => 'x'
), 'data1', 'data3');
}
\koolreport\d3\LineChart::create(array(
"dataSource" => $_SESSION['data'],
"columns" => $series,
"options" => array(
"data" => array(
'colors' => array(
"data3" => '#2ca02c '
)
)
)
));
