Get started with KoolReport
Introduction #
This tutorial guides you through steps to install KoolReport and also create a simple report with charts and graphs with KoolReport. It will go through basic setup file structure, data connection information, data processing and data visualization.
Step-by-steps #
Install KoolReport with composer #
Create a folder salereport
as the project folder and then use composer
to install koolreport/core
composer require koolreport/core
After running the command, composer will download the koolreport library and you will see a folder vendor
is created inside salereport
and also a file composer.json
is created.
|-salereport
|-vendor
|-composer.json
Congrat, you have successfully install KoolReport via composer.
Create report files #
Create 2 php files SaleReport.php
and SaleReport.view.php
. The SaleReport.php will define the report and SaleReport.view.php will contain the view of report.
|-salereport
|-vendor
|-composer.json
|-SaleReport.php
|-SaleReport.view.php
SaleReport.php
<?php
class SaleReport extends \koolreport\KoolReport
{
}
SaleReport.view.php
<html>
<head>
<title>Top 10 paying customers</title>
</head>
<body>
</body>
</html>
Provide database connection information #
Now in the file SaleReport.php
, we will add a settings()
methods and provide detail database connection
<?php
class SaleReport extends \koolreport\KoolReport
{
...
//Provide database settings
protected function settings()
{
return array(
"dataSources"=>array(
"automaker"=>array(
"connectionString"=>"mysql:host=localhost;dbname=automaker",
"username"=>"root",
"password"=>"",
"charset"=>"utf8"
)
)
);
}
...
}
We will return an array in settings(). This array contains many settings and "dataSources"
is one of them. In the dataSources section, we will provide list of data sources to be used in reports. Here we have only one datasource called automaker
. We define the connection information for automaker
in form of array as well.
Setup report data flow #
Create a function setup()
in SaleReport class to direct data flow
<?php
class SaleReport extends \koolreport\KoolReport
{
...
//Setup data flow
protected function setup()
{
$this->src("automaker")
->query("
SELECT customers.customerName, sum(payments.amount) as saleamount
FROM payments
JOIN customers ON customers.customerNumber = payments.customerNumber
GROUP BY customers.customerName
LIMIT 10
")
->pipe($this->dataStore("result"));
}
}
Above we select the automaker
source and provide a SQL query to get data, the data after pulling will be save to data store called "result"
to be used later in the view of report.
Construct view for report #
We create a bar chart and a table inside the view
<html>
<head>
<title>Top 10 paying customers</title>
</head>
<body>
<?php
\koolreport\widgets\google\BarChart::create(array(
"dataSource"=>$this->dataStore("result")
));
?>
<?php
\koolreport\widgets\koolphp\Table::create(array(
"dataSource"=>$this->dataStore("result")
));
?>
</body>
</html>
We have plugged data result
into widget BarChart and Table.
Include bootstrap for better report look and feel #
Adding the boostrap client trait to the SaleReport class
<?php
class SaleReport extends \koolreport\KoolReport
{
use \koolreport\clients\Bootstrap;
...
}
Initiate the report #
Now we create an index.php
to initiate the report:
<?php
require_once "vendor/autoload.php";
require_once "SaleReport.php";
$report = new SaleReport();
$report->run()->render();
We have include the "vendor/autoload.php" so that installed KoolReport library will be loaded. We include the SaleReport.php so that the class SaleReport will be avaiable. Then we create report object, run it and render it.
Watch video #
Get started with KoolReport
KoolReport will help you to construct good php data report by gathering your data from multiple sources, transforming them into valuable insights, and finally visualizing them in stunning charts and graphs.