Charts
The charts are based on chart js. All charts are registered in
resources\js\HoggarLibs\Charts
with 5 type of charts:
- Bar
- Line
- Pie
- PolarArea
- Doughnut
Go to App\Http\Controllers\Hoggar\Dashboard\DashboardController and create a props named
'chart1'.
public function index(Request $request)
{
return Inertia::render('HoggarPages/Dashboard/Dashboard', [
/* ... */
'chart1' => [
'datas' => [mt_rand(1, 12), mt_rand(1, 12), mt_rand(1, 12)],
'labels' => ['Jan', 'Fev', 'Mars']
],
/* ... */
]);
}
In resources\js\Pages\HoggarPages\Dashboard\Dashboard.vue in setup.
const props = defineProps({
/* ... */
chart1: {
type: Object,
required: true
},
/* ... */
});
In resources\js\Pages\HoggarPages\Dashboard\Dashboard.vue in the template.
<ChartBarre
:Myprops=props.chart1
:Namechart='chart1'
/>