Chart card
Bootstrap 5 Chart card component
Responsive Chart card built with Bootstrap 5. A simple and quick way to put a chart on a card.
Basic example
Put chart element in div with .card-body
class.
performance
<div class="card shadow-2-strong" style="width: 32rem;">
<div class="card-body">
<p class="text-uppercase mb-2"><strong>performance</strong></p>
<hr />
<canvas
data-mdb-chart="bar"
data-mdb-dataset-label="Total Orders"
data-mdb-labels="['Jul', 'Aug' , 'Sep' , 'Oct' , 'Nov' , 'Dec']"
data-mdb-dataset-data="[212, 183, 165, 193, 265, 221]">
</canvas>
</div>
</div>