• Overview
• Title
• Label
• Tooltip

DonutChart

Overview #

DonutChart (also known as Doughnut chart) is a variation on a Pie chart except it has a round hole in the center which makes it look like a donut, hence the name. This empty space can be used to display additional data.

\koolreport\d3\DonutChart::create(array(
    "dataStore"=>array(
        array("category"=>"Books","sale"=>90,"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),
    ),
    "title"=>"Cost of Good Sold"
    "columns"=>array(
        "category",
        "cost"
    ),
    "label"=>array(
        "use"=>"ratio",
    ),
    "tooltip"=>array(
        "use"=>"value",
        "prefix"=>"$"
    )
));

Title #

You may set the title property for the title appearing at the center of donut.

DonutChart::create(array(
    "title"=>"My chart title",
    ...
));

Label #

This is the settings for label appearing on each donut, you may hide/show the label. You also can choose between "ratio" or "value" to be shown. There are options for you to format the number on label such as decimals, decPoint, thousandSep, prefix and suffix.

DonutChart::create(array(
    ...
    "label"=>array(
        "show"=>true, // Whether to show label
        "use"=>"ratio", // Accept "ratio" or "value" to display whether the real value or calculated ratio
        "decimals"=>2,
        "decPoint"=>".",
        "thousandSep"=>",",
        "prefix"=>"$",
        "suffix"=>"",
    )
));

Tooltip #

This is the settings for tooltip appearing on each donut when mouse is over, you may hide/show the tooltip. You also can choose between "ratio" or "value" to be shown. There are options for you to format the number on label such as decimals, decPoint, thousandSep, prefix and suffix.

DonutChart::create(array(
    ...
    "tooltip"=>array(
        "show"=>true, // Whether to show label
        "use"=>"ratio", // Accept "ratio" or "value" to display whether the real value or calculated ratio
        "decimals"=>2,
        "decPoint"=>".",
        "thousandSep"=>",",
        "prefix"=>"$",
        "suffix"=>"",
    )
));