- Overview
- Setup exporting
- PDF/PNG/JPG engines
- Excel engines
- CSV engines
- Widget export
- Widget excel setting
- Dashboard Export
- Config overwrite
- Custom export parameters
- Custom export content
- Custom export view file
- Engine selection
Export
Overview #
Exporting feature is one of the must-have feature in any reporting system. Dashboard is able to export both widgets and dashboards to PDF/PNG/JPG, XLSX, and CSV file types.
Setup exporting #
In order to turn on exporting capability, you need to create, config and return an export handler object in method export()
of the App class.
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\ChromeHeadlessio; // used for PDF, JPG, and PNG export
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
// ->pdfEngine( // provide a separate engine for PDF export
->engine( // provide an engine for all PDF, JPG, PNG export
ChromeHeadlessio::create()->token("your-token")
);
}
}
Code explanation:
- Define an
export()
method under App. - Create an
ExportHandler
object. - Set the handler's storage where exported files will be stored.
- Provide the PDF engine to
pdfEngine()
orengine()
method. In this case we useChromeHeadlessio
as our PDF engine. - The ChromeHeadlessio requires token key which you can generate after registering our chromeheadless cloud service.
- Return the
ExportHandler
object.
You can also provide multiple engines in one function call with engine()
method. Each engine can has its own name for later engine selection when exporting:
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\LocalExport; // used for PDF, JPG, and PNG export
use \koolreport\dashboard\export\ChromeHeadlessio; // used for PDF, JPG, and PNG export
use \koolreport\dashboard\export\XLSXEngine; // used for XLSX export
use \koolreport\dashboard\export\CSVEngine; // used for CSV export
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
->engine( // provide multiple engines for multiple file types export
LocalExport::create('LocalPdfEngine'),
ChromeHeadlessio::create('CloudPdfEngine')->token("your-token"),
XLSXEngine::create('ExcelEngine'),
CSVEngine::create('CsvEngine')
);
}
}
If later export config doesn't specify an engine name the last provided engine capable of exporting a file type will be used for that type export. In the above code, without any engine specification in export config ChromeHeadlessio
engine will be used for PDF, JPG, and PND export instead of LocalExport
one since it's provided later.
An export engine for any file type must have a method named after that type and return the exported file. Dashboard provides several available export engines for PDF, JPG, PNG, XLSX, and CSV file types.
An engine can be created with or without name. Engine name would be useful if you want to specify exactly which engine you want to use when exporting a dashboard or a widget.
PDF/PNG/JPG engines #
We provided 2 engines that use to generate PDF, PNG and JPG which are LocalExport
and ChromeHeadlessio
. While the LocalExport will use the Export package of KoolReport Pro to generate exported files, the ChromeHeadlessio will use CloudExport package to do so.
LocalExport #
Name | description |
---|---|
defaultConfig(array $config) | Provide default export settings |
settings(array $settings) | Provide settings for localexport, learn more about settings |
Example:
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\LocalExport;
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
// provide separate engines for multiple file type export
->pdfEngine(
LocalExport::create()
->defaultConfig([ // set exporting default config for PDF
"format"=>"A4",
"margin"=>"1in",
"orientation"=>"portrait"
])
)
->jpgEngine(
LocalExport::create() //You can use defaultConfig() to set exporting default config for JPG
)
->pngEngine(
LocalExport::create() //You can use defaultConfig() to set exporting default config for PNG
);
}
}
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\LocalExport;
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
->engine( // provide an engine for PDF, JPG, and PNG export
LocalExport::create()
->defaultConfig([
"format"=>"A4",
"margin"=>"1in",
"orientation"=>"portrait"
])
);
}
}
ChromeHeadlessio #
Name | description |
---|---|
defaultConfig(array $config) | Provide default export settings |
token(string $token) | Provide the token key to use ChromeHeadlessio service |
settings(array $settings) | Provide settings for localexport, learn more about settings |
Example:
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\ChromeHeadlessio;
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
->pdfEngine( // provide separate engines for multiple file type export
ChromeHeadlessio::create()
->token("your-token")
->defaultConfig([
"format"=>"A4",
"margin"=>[
"top"=>"1in",
"bottom"=>"1in",
"left"=>"1in",
"right"=>"1in",
],
])
)
->jpgEngine(
ChromeHeadlessio::create()
->token("your-token")
//You can use defaultConfig() to set exporting config for jpg
)
->pngEngine(
ChromeHeadlessio::create()
->token("your-token")
//You can use defaultConfig() to set exporting config for png
);
}
}
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\ChromeHeadlessio;
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
->engine( // provide an engine for all PDF, JPG, and PNG export
ChromeHeadlessio::create()
->token("your-token")
->defaultConfig([
"format"=>"A4",
"margin"=>[
"top"=>"1in",
"bottom"=>"1in",
"left"=>"1in",
"right"=>"1in",
],
])
);
}
}
Excel engines #
XLSXEngine #
Name | description |
---|---|
defaultConfig(array $config) | Get/get the default config for Excel exporting |
rawData | Bool value, whether the data is in raw, default value is true |
useTable | Bool value, whether use the excel table instead of excel chart, default value is true |
Example:
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\XLSXEngine;
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
// ->xlsxEngine(
->engine( // equivalent to xlsxEngine()
XLSXEngine::create()
->defaultConfig([
])
->rawData(true)
->useTable(true)
);
}
}
By default an XLSX engine exports a widget (charts, table, pivottable, pivotmatrix, etc) to table format with the default config's property "useTable" => true or useTable(true). If you want the engine to export to chart format you can set "useTable" => false or call useTable(false).
More options of defaultConfig
of Excel can be found here.
CSV engines #
CSVEngine #
As the name suggested, CSVEngine helps to export to CSV.
Name | description |
---|---|
defaultConfig(array $config) | Provide default config for csv exporting |
delimiter | The delimiter between data column, default is comma , |
rawData | Get/set whether csv data is in raw format, default value is true |
Example:
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\CSVEngine;
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
// ->csvEngine(
->engine( // equivalent to csvEngine()
CSVEngine::create()
->defaultConfig([
"BOM"=>false,
"buffer"=>100,
...
])
->delimiter(",")
->rawData(true)
);
}
}
More options of config for CSVEngine can be found here.
Widget export #
Enable and config #
To make an widget exportable to PDF, you call its {type}Exportable() method, such as pdfExportable()
:
class MyDashboard extends Dashboard
{
protected function content()
{
return [
MyChart::create()
->pdfExportable(true) //Allow exporting widget MyChart to PDF
->jpgExportable(true) //Allow exporting widget MyChart to JPG
->pngExportable(true) //Allow exporting widget MyChart to PNG
->xlsxExportable(true) //Allow exporting widget MyChart to XLSX
->csvExportable(true); //Allow exporting widget MyChart to CSV
];
}
}
If you need to make a custom exporting config for your widget, you insert your config array in form of array into exportable function. This config overwrites the default config of the App's export engine.
class MyDashboard extends Dashboard
{
return [
MyChart::create()
->pdfExportable([
"format"=>"Letter",
])
->xlsxExportable([
"rawData" => true, // use raw data instead of formatted data
"useTable"=>false, // export to chart format instead of table one
])
->csvExportable([
"delimiter"=>";", // use semicolon as delimiter instead of the default comma in CSV engine
])
];
}
The same settings is applied for other exporting types
Name | description |
---|---|
->pdfExportable(mixed $config) | Turn on PDF exportable for widget, the argument could be boolean or an extra export config for that widget |
->pngExportable(mixed $config) | Turn on PNG exportable for widget, the argument could be boolean or an extra export config for that widget |
->jpgExportable(mixed $config) | Turn on JPG exportable for widget, the argument could be boolean or an extra export config for that widget |
->xlsxExportable(mixed $config) | Turn on XLSX exportable for widget, the argument could be boolean or an extra export config for that widget |
->csvExportable(mixed $config) | Turn on CSV exportable for widget, the argument could be boolean or an extra export config for that widget |
Trigger exporting #
Now, you have set up your exporting engines and also turn on exportable capability in your widget, now you can trigger exporting with client-side exportTo{Type} method calling:
class MyDashboard extends Dashboard
{
protected function content()
{
return [
MyChart::create()->pdfExportable(true),
Button::create()->text("Export to PDF")->onClick(
Client::widget("MyChart")->exportToPDF()
)
];
}
}
Code explanation:
- You have MyChart widget with ability to export to PDF
- You have a button with text "Export to PDF".
- When user click to that button, it will tell the widget MyChart to export to PDF.
- The file will be generated and sent to browser to download
Widget excel setting #
When exporting a widget to excel, you can set its excel properties via excelSetting()
method:
use \koolreport\dashboard\widgets\google\LineChart;
class LineChartDemo extends LineChart
{
//...
protected function excelSetting()
{
$styleArray = [
'font' => [
'name' => 'Calibri', //'Verdana', 'Arial'
'size' => 30,
'bold' => true,
'italic' => true
],
];
return [
"excelStyle" => [
"header" => function($colName) use ($styleArray) {
return $styleArray;
},
"cell" => function($colName, $value, $row) use ($styleArray) {
return $styleArray;
},
],
];
}
An excel table or chart widget's properties could be found here and here
use \koolreport\dashboard\widgets\pivot\PivotTable;
class CustomersPivotTable extends PivotTable
{
//...
protected function excelSetting()
{
return [
'rowSort' => array(
'dollar_sales - sum' => 'desc',
),
'totalName' => 'All',
'map' => array(
'dataField' => [
'dollar_sales - sum' => 'Sales (in USD)',
'dollar_sales - count' => 'Number of Sales',
]
),
"excelStyle" => array(
//...
),
];
}
}
An excel's PivotTable widget's properties could be found here
Dashboard Export #
Enable and config #
To turn on the exporting feature in Dashboard, you call its {type}Exportable() method, such as pdfExportable()
:
class MyDashboard extends Dashboard
{
protected function onCreated()
{
$this
->pdfExportable(true) //Allow exporting dashboard MyDashboard to PDF
->jpgExportable(true) //Allow exporting dashboard MyDashboard to JPG
->pngExportable(true) //Allow exporting dashboard MyDashboard to PNG
->xlsxExportable(true) //Allow exporting dashboard MyDashboard to XLSX
->csvExportable(true); //Allow exporting dashboard MyDashboard to CSV
}
}
If you need to make a custom exporting config for your dashboard, you insert your config array in form of array into exportable function. This config overwrites the default config of the App's export engine.
class MyDashboard extends Dashboard
{
protected function onCreated()
{
// Turn on exporting to pdf and provide extra settings for the export
$this
->pdfExportable([
"format"=>"A4",
"margin"=>[
"top"=>"1in",
"bottom"=>"1in",
"left"=>"1in",
"right"=>"1in",
],
])
->xlsxExportable([
"rawData" => true, // use raw data instead of formatted data
"useTable"=>false, // export to chart format instead of table one
])
->csvExportable([
"delimiter"=>";", // use semicolon as delimiter instead of the default comma in CSV engine
])
;
}
}
Trigger exporting #
In order to export the dashboard to pdf, you use client-side exportTo{Type} method calling
class MyDashboard extends Dashboard
{
protected function onCreated()
{
$this->pdfExportable(true);
}
protected function content()
{
return [
Button::create("Export dashboard to PDF")->onClick(
Client::dashboard($this)->exportToPDF()
)
]
}
}
Config overwrite #
With both dashboard and widget exports, in the exportTo{Type}()
command you can overwrite {type}Exportable()
's config, which itself overwrites the default config of the export engine:
class MyDashboard extends Dashboard
{
protected function onCreated()
{
$this
->pdfExportable(["format" => "Letter"]) // this PDF exportable's config takes precedence over the default config of the PDF engine
->xlsxExportable([
"rawData" => false,
"useTable" => true,
]) // this XLSX exportable's config takes precedence over the default config of the XLSX engine
->csvExportable(["delimiter" => ","]), // this CSV exportable's config takes precedence over the default config of the CSV engine
;
}
protected function content()
{
return [
MyChart::create()
->pdfExportable(["format" => "Letter"]) // this PDF exportable's config takes precedence over the default config of the PDF engine
->xlsxExportable([
"rawData" => false,
"useTable" => true,
]) // this XLSX exportable's config takes precedence over the default config of the XLSX engine
->csvExportable(["delimiter" => ","]), // this CSV exportable's config takes precedence over the default config of the CSV engine
Button::create()->text("Export chart to PDF")->onClick(
Client::widget("MyChart")->exportToPDF("widget_pdf_file_name", [
"format" => "A4" // PDF format "A4" will take precedence over "Letter" in MyChart's pdfExportable()
])
),
Button::create()->text("Export chart to Excel")->onClick(
Client::widget("MyChart")->exportToXLSX("widget_excel_file_name", [
"rawData" => true, // raw data will be used in excel export instead of using formatted data in MyChart's xlsxExportable()
"useTable" => false // excel chart will be used in excel export instead of using table in MyChart's xlsxExportable()
])
),
Button::create()->text("Export chart data to CSV")->onClick(
Client::widget("MyChart")->exportToCSV("widget_csv_file_name", [
"delimiter" => ";" // CSV delimiter ";" will take precedence over "," in MyChart's csvExportable()
])
),
Button::create("Export dashboard to PDF")->onClick(
Client::dashboard($this)->exportToPDF("dashboard_pdf_file_name", ["orientation"=>"landscape"]) // PDF orientation "landscape" will take precedence over "portrait" in MyDashboard's pdfExportable()
),
Button::create()->text("Export to Excel")->onClick(
Client::dashboard($this)->exportToXLSX("dashboard_excel_file_name", [
"rawData" => true, // raw data will be used in excel export instead of using formatted data in MyDashboard's xlsxExportable()
"useTable" => false // excel chart will be used in excel export instead of using table in MyDashboard's xlsxExportable()
])
),
Button::create()->text("Export to CSV")->onClick(
Client::dashboard($this)->exportToCSV("dashboard_csv_file_name", [
"delimiter" => ";" // CSV delimiter ";" will take precedence over "," in MyDashboard's csvExportable()
])
)
];
}
}
Custom export parameters #
In some case, you want to trigger exporting with some custom parameters, which is possible in exportTo{Type}()
command.
With widget export:
class MyDashboard extends Dashboard
{
protected function content()
{
return [
MyChart::create()->pdfExportable(true),
Button::create()->text("Export to PDF")->onClick(
Client::widget("MyChart")->exportToPDF("widget_pdf_file_name", ["key"=>"value"]) // You can set any custom parameters here
)
];
}
}
You can catch those parameter with onExporting
event in MyChart:
class MyChart extends ColumnChart
{
...
protected function onExporting($params)
{
$value = $params["key"];
//Base on parameters received, you can do custom settings for your chart
//before it getting exported.
return true; //Return true to allow exporting, return false will cancel exporting
}
...
}
With dashboard export:
class MyDashboard extends Dashboard
{
protected function onCreated()
{
$this->pdfExportable(true);
}
protected function onExporting($params)
{
$value = $params["key"];
// Here, base on value you receieved from $params
// you can make any custom change to dashboard
// before it gets exported.
return true; //Return true to approve exporting, return false will cancel exporting
}
protected function content()
{
return [
Button::create("Export dashboard to PDF")->onClick(
Client::dashboard($this)->exportToPDF("dashboard_pdf_file_name", ["key"=>"value"]) // You can set any custom parameters here
)
]
}
}
Custom export content #
By default, Dashboard will export only the view of the dashboard or widget you want to export. However, in many cases you want to change the exported view a little such as: adding header, description for the exported content.
Both Dashboard and Widget have a public method called exportedView()
which you can derive and alternate the exported content.
Example:
use \koolreport\dashboard\containers\Html;
class MyWidget extends \koolreport\dashboard\widgets\Table
{
...
public function exportedView($params)
{
//We add header on top of Widget content
return Html::div()->class("text-center")->sub([
Html::h1("Big Center Header")
]).
$this->view(); // This is widget content
}
...
}
The same way of customizing exported content is applied for dashboard class.
Custom export view file #
Since version 4.2.0, Dashboard supports custom export view files for both dashboard and widget export, similarly to KoolReport Pro report's PDF and Excel exports, using viewFile
config property. A view file has name in the format {filename}.view.php and its path is relative to the dashboard or widget being exported. You can set the view file in either server-side {type}Exportable()
method or client-side exportTo{Type}()
one. If both set, the view in exportTo{Type}()
will overwrite the one in {type}Exportable()
.
Here's an example of setting a view file in {type}Exportable()
method:
/**
./ExcelCSVBoard.php
./dashboard_excel_views/ExcelCSVBoardExcel.view.php
./LineChartDemo.php
./widget_excel_views/ExcelCSVBoardExcel.view.php
*/
class ExcelCSVBoard extends Dashboard
{
protected function onInit()
{
$this->xlsxExportable([
//... // other configs
'viewFile' => './dashboard_excel_views/ExcelCSVBoardExcel' // dashboard excel export view file ExcelCSVBoardExcel.view.php, its path is relative to the dashboard class file ExcelCSVBoard.php
]);
}
protected function content()
{
return [
Panel::success([
//... // other widgets
LineChartDemo::create()
->xlsxExportable([
'viewFile' => './widget_excel_views/LineChartDemoExcel' // widget excel export view file LineChartDemoExcel.view.php, its path is relative to the widget class file LineChartDemo.php
])
])
];
}
Here's an example of setting a view file in exportTo{Type}()
command:
class ExcelCSVBoard extends Dashboard
{
protected function onInit()
{
$this->xlsxExportable(true);
}
protected function content()
{
return [
Panel::success([
Html::div([
Dropdown::create("exporting")
->title("Export")
->align("right")
->items([
Dropdown::menuItem()
->text("Dashboard to Excel")
->icon("far fa-file-excel")
->onClick(
Client::dashboard($this)
->exportToXLSX("dashboard_excel_file_name", ['viewFile' => './dashboard_excel_views/ExcelCSVBoardExcel'])
),
Dropdown::menuItem()
->text("Chart to Excel")
->icon("far fa-file-excel")
->onClick(
Client::widget("LineChartDemo")
->exportToXLSX("widget_excel_chart_file_name", 'viewFile' => './widget_excel_views/LineChartDemoExcel')
),
Dropdown::menuItem()
->text("Chart Data to Excel")
->icon("far fa-file-excel")
->onClick(
Client::widget("LineChartDemo")
->exportToXLSX("widget_excel_table_file_name", ['viewFile' => './widget_excel_views/TableDemoExcel'])
)
]),
])->class("text-right"),
LineChartDemo::create()
->xlsxExportable(true)
])
];
}
Here's an example of setting view files in both {type}Exportable()
and exportTo{Type}()
:
/**
./PDFBoard.php
./dashboard_pdf_views/PDFBoardPDF.view.php
./dashboard_pdf_views/PDFBoardPDF2.view.php
*/
class PDFBoard extends Dashboard
{
protected function onCreated()
{
$this->pdfExportable([
//... // other configs
'viewFile' => './dashboard_pdf_views/PDFBoardPDF' // dashboard PDF export view file PDFBoardPDF.view.php, its path is relative to the dashboard class file PDFBoard.php
]);
}
protected function content()
{
return [
Panel::create()->header("PDF Export")->type("danger")->sub([
Dropdown::create("exportOptions")
->title("<i class='far fa-file-pdf'></i> Export To PDF")
->items([
"Export Dashboard"=>MenuItem::create()
->onClick(
Client::showLoader().
Client::dashboard($this)->exportToPDF("dashboard_pdf_file_name", [
'viewFile' => './dashboard_pdf_views/PDFBoardPDF2' // this view file will take precedence over the one in pdfExportable
])
),
])
->align("right")
->cssStyle("margin-bottom:5px;")
->cssClass("text-right"),
ProductTable::create()
])
];
}
View file variables #
In a dashboard export's view file you can access the dashboard via $dashboard variable to get its widgets and their exported data and view:
<!-- ExcelCSVBoardExcel.view.php -->
<div>
<div>Dashboard Excel Export</div>
<div>
<?php
$LineChartDemo = $dashboard->widget("LineChartDemo"); // $dashboard is the dashboard being exported, `ExcelCSVBoard` in this case
// \koolreport\excel\LineChart::create([
\koolreport\excel\Table::create([
"dataSource"=>$LineChartDemo->exportedData()
]);
?>
</div>
</div>
<!-- PDFBoardPDF.view.php -->
<!DOCTYPE html>
<html>
<head></head>
<body>
PDFBoard PDF Export
<?php
$ProductTable = $dashboard->widget('ProductTable'); // $dashboard is the dashboard being exported, `PDFBoard` in this case
echo $ProductTable->pageSize(50)->exportedView();
?>
</body>
</html>
In a widget export's view file you can access the widget via $widget variable to get its exported data and view:
<!-- LineChartDemoExcel.view.php -->
<!-- TableDemoExcel.view.php -->
<div>
<div>Widget Excel Export</div>
<div>
<?php
// \koolreport\excel\LineChart::create([
\koolreport\excel\Table::create([
"dataSource"=>$widget->exportedData() // $widget is the widget being exported, `LineChartDemo` in this case
]);
?>
</div>
</div>
Engine selection #
Sinver Dashboard version 4.2.0, in either {type}Exportable()
or exportTo{Type}()
method you can specify exactly which provided engine in App to be used when exporting a dashboard or widget. Like other config, if both set the one in exportTo{Type}()
will overwrite the one in {type}Exportable()
.
use \koolreport\dashboard\ExportHandler;
use \koolreport\dashboard\export\LocalExport; // used for PDF, JPG, and PNG export
use \koolreport\dashboard\export\ChromeHeadlessio; // used for PDF, JPG, and PNG export
use \koolreport\dashboard\Application;
class App extends Application
{
...
protected function export()
{
return ExportHandler::create()
->storage(dirname(__DIR__)."/storage")
->engine( // provide multiple engines for multiple file types export
LocalExport::create('LocalPdfEngine'),
ChromeHeadlessio::create('CloudPdfEngine')->token("your-token")
);
}
}
class MyDashboard extends Dashboard
{
protected function onCreated()
{
$this->pdfExportable([
"engine" => "LocalPdfEngine"
]);
}
protected function content()
{
return [
MyChart::create()->pdfExportable([
'engine' => 'LocalPdfEngine'
]),
Button::create()->text("Export chart to PDF")->onClick(
Client::widget("MyChart")->exportToPDF('widget_pdf_file_name', [
'engine' => 'CloudPdfEngine' // this engine will take precedence over the one in MyChart's pdfExportable
])
),
Button::create("Export dashboard to PDF")->onClick(
Client::dashboard($this)->exportToPDF("dashboard_pdf_file_name", [
"engine"=>"CloudPdfEngine" // this engine will take precedence over the one in MyDashboard's pdfExportable
])
)
];
}
}
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.