在我的项目中，我有一个甜甜圈图。但我想让它看起来像个速度计。我使用chart.js（html，css，js）创建了这个圆环图。我只是想展示它的一半或作为一个速度表。这里是示例的我希望它显示像

// Data for the donut chart (Group 2 first, then Group 1)
const data = {
    labels: ['Group 2', 'Group 1'], // Swap the order of labels
    datasets: [{
        data: [30, 70], // Swap the order of data values
        backgroundColor: ['#A1A5B7', '#F1BC00'], // Colors for each group
    }]
};

// Configuration for the chart
const config = {
    type: 'doughnut', // Use doughnut chart type for a donut chart
    data: data,
    options: {
        rotation: 0.5 * Math.PI, // Rotate the chart to 180 degrees
        cutout: '70%', // Cutout percentage for a 180-degree chart
        plugins: {
            legend: {
                display: false, // Hide the legend if not needed
            },
        },
    },
};

// Get the canvas element and create the chart
const canvas = document.getElementById('donut-chart');
const ctx = canvas.getContext('2d');
new Chart(ctx, config);

body {
  font-family: Arial, sans-serif;
  text-align: center;
}

.donut-container {
  text-align: center;
  margin-top: 20px;
}

.chart-container {
  width: 100%; /* Make the container responsive */
  max-width: 500px; /* Optionally, set a maximum width */
  margin: 0 auto; /* Center the container */
}

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<div class="donut-container">
    <div class="chart-container">
        <canvas id="donut-chart"></canvas>
    </div>
</div>