Doughnut Chart NEW
1.7.27 Semantic UI theme
Simply create charts and doughnut graph
HIDE CODE
<style>
canvas{
height: 600px!important;
}
</style>
<?php
// Bar Chart Example - First Instance
$xcrud1 = Xcrud::get_instance();
$xcrud1->table('orderdetails');
$xcrud1->chart_labels(
['S24_2841', 'S24_3420', 'S24_3949', 'S24_4278', 'S32_4289', 'S50_1341'], // Labels
[ // Multiple datasets (even if there's just one)
[
'label' => '# of Quantity Ordered', // Dataset label
'data' => '#select quantityOrdered from orderdetails where id IN (60,61,62,63,64,65)', // Data points
'backgroundColor' => [ // Different colors for each segment
'rgba(255, 99, 132, 0.2)', // Red - S24_2841
'rgba(54, 162, 235, 0.2)', // Blue - S24_3420
'rgba(255, 206, 86, 0.2)', // Yellow - S24_3949
'rgba(75, 192, 192, 0.2)', // Green - S24_4278
'rgba(153, 102, 255, 0.2)', // Purple - S32_4289
'rgba(255, 159, 64, 0.2)' // Orange - S50_1341
],
'borderColor' => [ // Different border colors for each segment
'rgba(255, 99, 132, 1)', // Red - S24_2841
'rgba(54, 162, 235, 1)', // Blue - S24_3420
'rgba(255, 206, 86, 1)', // Yellow - S24_3949
'rgba(75, 192, 192, 1)', // Green - S24_4278
'rgba(153, 102, 255, 1)', // Purple - S32_4289
'rgba(255, 159, 64, 1)' // Orange - S50_1341
],
'borderWidth' => 1 // Border width for each segment
]
],
'doughnut', // Chart type (e.g., 'pie')
[
'plugins' => [
'legend' => ['display' => true] // Display the legend
]
] // Custom options (e.g., legend display)
);
$xcrud1->chart_view(true);
$xcrud1->unset_add();
$xcrud1->unset_edit();
$xcrud1->unset_remove();
$xcrud1->unset_view();
$xcrud1->unset_csv();
$xcrud1->unset_limitlist();
$xcrud1->unset_numbers();
$xcrud1->unset_pagination();
$xcrud1->unset_print();
$xcrud1->unset_search();
$xcrud1->unset_title();
$xcrud1->unset_sortable();
echo $xcrud1->render();
?>
| Ordernumber | Productcode | Quantityordered | Priceeach | Orderlinenumber | Total |
|---|---|---|---|---|---|
| 10100 | ' | 100 | 136 | 3 | 1360.00 |
| 10100 | S18_2248 | 500 | 55.09 | 2 | 2754.50 |
| 10100 | S24_3969 | 49 | 35.29 | 1 | 1729.20 |
| 10101 | S18_2325 | 20 | 108.06 | 4 | 0.00 |
| 10101 | S18_2795 | 26 | 167.06 | 12222 | 0.00 |
| 10101 | S24_1937 | 45 | 32.53 | 3 | 1463.90 |
| 10101 | S24_2022 | 46 | 44.35 | 2 | |
| 10102 | S18_1342 | 39 | 95.55 | 2 | |
| 10102 | S18_1367 | 41 | 43.13 | 1 | |
| 10103 | S18_1097 | 35 | 94.5 | 10 |