DonutChart

This example shows how to draw beautiful DonutChart

Basic chart
Cost of Good Sold16.8%30.3%32.8%15.1%5.0%05000100001500020000250003000035000400000BooksAccessoriesPhonesMoviesOthers
Label and tooltip format
Cost of Good Sold16.81%30.25%32.77%15.13%5.04%05000100001500020000250003000035000400000BooksAccessoriesPhonesMoviesOthers

The above example shows you how to create DonutChart 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.

In above examples we show you:

  1. Create a simple donut chart
  2. Format the label and tooltip
<?php

require_once "../../../load.koolreport.php";
require_once "MyReport.php";

$report = new MyReport;
$report->run()->render();
<?php

class MyReport extends \koolreport\KoolReport
{

}
<?php
    use \koolreport\d3\DonutChart;

    $category_amount = array(
        array("category"=>"Books","sale"=>32000,"cost"=>20000,"profit"=>12000),
        array("category"=>"Accessories","sale"=>43000,"cost"=>36000,"profit"=>7000),
        array("category"=>"Phones","sale"=>54000,"cost"=>39000,"profit"=>15000),
        array("category"=>"Movies","sale"=>23000,"cost"=>18000,"profit"=>5000),
        array("category"=>"Others","sale"=>12000,"cost"=>6000,"profit"=>6000),
    );
?>
<div class="report-content">
    <div class="text-center">
        <h1>DonutChart</h1>
        <p class="lead">
            This example shows how to draw beautiful DonutChart
        </p>
    </div>

    <div style="margin-bottom:50px;">
    <div class="text-center"><strong>Basic chart</strong></div>
    <?php
    DonutChart::create(array(
        "title"=>"Cost of Good Sold",
        "dataSource"=>$category_amount,
        "columns"=>array("category","cost")
    ));
    ?>
    </div>


    <div style="margin-bottom:50px;">
    <div class="text-center"><strong>Label and tooltip format</strong></div>
    <?php
    DonutChart::create(array(
        "title"=>"Cost of Good Sold",
        "dataSource"=>$category_amount,
        "columns"=>array(
            "category",
            "cost"
        ),
        "label"=>array(
            "use"=>"ratio",
            "decimals"=>2,
            "suffix"=>"%"
        ),
        "tooltip"=>array(
            "use"=>"value",
            "prefix"=>"$"
        )
    ));
    ?>
    </div>


</div>

What People Are Saying

"KoolReport helps me very much in creating data report for my corporate! Keep up your good work!"
-- Alain Melsens

"The first use of your product. I was impressed by its easiness and powerfulness. This product is a great and amazing."
-- Dr. Lew Choy Onn

"Fantastic framework for reporting!"
-- Greg Schneider

Download KoolReport Get KoolReport Pro