Bootstrap Charts - Adminkit
Discover 2 Bootstrap Charts available in Adminkit
Chart Line
<div class="card flex-fill w-100 draggable">
<div class="card-header">
<h5 class="card-title mb-0">Recent Movement</h5>
</div>
<div class="card-body py-3">
<div class="chart chart-sm"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>
<canvas id="chartjs-dashboard-line" style="display: block; height: 252px; width: 428px;" width="856" height="504" class="chart-line chartjs-render-monitor"></canvas>
</div>
</div>
</div><div class="card flex-fill w-100 draggable">
<div class="card-header">
<h5 class="card-title mb-0">Recent Movement</h5>
</div>
<div class="card-body py-3">
<div class="chart chart-sm"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>
<canvas id="chartjs-dashboard-line" style="display: block; height: 252px; width: 428px;" width="856" height="504" class="chart-line chartjs-render-monitor"></canvas>
</div>
</div>
</div>Chart Pie
<div class="card flex-fill w-100 draggable">
<div class="card-header">
<h5 class="card-title mb-0">Browser Usage</h5>
</div>
<div class="card-body d-flex">
<div class="align-self-center w-100">
<div class="py-3">
<div class="chart chart-xs"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>
<canvas id="chartjs-dashboard-pie" width="856" height="400" style="display: block; height: 200px; width: 428px;" class="chart-pie chartjs-render-monitor"></canvas>
</div>
</div>
<table class="table mb-0">
<tbody>
<tr>
<td>Chrome</td>
<td class="text-end">4306</td>
</tr>
<tr>
<td>Firefox</td>
<td class="text-end">3801</td>
</tr>
<tr>
<td>IE</td>
<td class="text-end">1689</td>
</tr>
</tbody>
</table>
</div>
</div>
</div><div class="card flex-fill w-100 draggable">
<div class="card-header">
<h5 class="card-title mb-0">Browser Usage</h5>
</div>
<div class="card-body d-flex">
<div class="align-self-center w-100">
<div class="py-3">
<div class="chart chart-xs"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>
<canvas id="chartjs-dashboard-pie" width="856" height="400" style="display: block; height: 200px; width: 428px;" class="chart-pie chartjs-render-monitor"></canvas>
</div>
</div>
<table class="table mb-0">
<tbody>
<tr>
<td>Chrome</td>
<td class="text-end">4306</td>
</tr>
<tr>
<td>Firefox</td>
<td class="text-end">3801</td>
</tr>
<tr>
<td>IE</td>
<td class="text-end">1689</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>