Visualize Data With Koolphp Table

November 10, 2017

Table is the most used option when come to data visualization. Even data is successfully displayed with other types of charts, table is still preferred to go along to support. KoolPHP Table is a built-in widget in KoolReport containing the most crucial features in data presentation.

Get started with KoolPHP Table

Suppose you have data in a dataStore named "employees", you can display those data in koolphp/Table simply by

<?php
Table::create(array(
    "dataSource"=>$this->dataStore("employees"),
));
?>

It is easy isn't it.

Customize the table columns

There are many time you need to choose which columns from dataStore to display on the table and customize the label of them.

<?php
Table::create(array(
    "dataSource"=>$this->dataStore("employees"),
    "columns"=>array(
        "id"=>array(
            "label"=>"Employee ID"
        ),
        "firstName"=>array(
            "label"=>"First Name",
        )
        "lastName"=>array(
            "label"=>"Last Name",
        )
    )
));
?>

Display footer with summarized data

KoolPHP Table can summarize data of columns at table footer.

<?php
Table::create(array(
    "dataSource"=>$this->dataStore("employees"),
    "showFooter"=>"bottom",
    "columns"=>array(
        "id"=>array(
            "label"=>"Employee ID",
        ),
        "firstName"=>array(
            "label"=>"First Name",
        ),
        "salary"=>array(
            "label"=>"Salary",
            "footer"=>"avg"
        )
    )
));
?>

Notice that we have the "footer"=>"avg" settings for column salary. This setting will tell Table to display average salary of employees at bottom of salary column.

The footer settings support "avg", "sum", "count", "min", "max".

Setup paging

Sometime the there are many rows in the dataStore and displaying them all makes the Table appear too large. The paging feature will solve this issue by dividing data into number of pages and providing navigation among pages for user to browse data.

To setup paging you do:

<?php
Table::create(array(
    "dataSource"=>$this->dataStore("employees"),
    "paging"=>array(
        "pageSize"=>10,
    )
));
?>

The "pageSize" will determine how many rows the table will display in a page.

Summary

In this tutorial, we have learned how to use KoolPHP Table to display data together with some features of data table.

The KoolReport Blog