<div class="chart-wrapper">
  <canvas id="myChart"></canvas>
</div>
.chart-wrapper {
 width: 95vh;
 margin: auto;
} 
const ctx = document.getElementById('myChart') as HTMLCanvasElement
new Chart(ctx, {
  type: 'doughnut',
  data: {
    datasets: [{
      data: [40, 70, 30],
      backgroundColor: [
        'rgb(200, 0, 0)',
        'rgb(0, 200, 0)',
        'rgb(0, 0, 200)'
      ]
    }]
  }
})
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.6.0/chart.min.js