chart.js中的甜甜圈图调整问题

Question

[每当我更改页面分辨率或大小或放大页面时，Chartjs就会调整图表，没关系。但是，撤消我的上一个动作时，它不会恢复其原始大小。实际上，它在我在页面上执行的每个操作中都会变得更大。

这就是我想要的：

这是我缩放时发生的事情：

function doughnut_config(data, labels, center_text, tooltip_enabled = true) {
  const config = {
    type: 'doughnut',
    data: {
      datasets: [{
        data: data,
        backgroundColor: backgroundColor,
        borderWidth: 0.3
      }],
      labels: labels
    },
    options: {
      legend: false,
      responsive: true,
      maintainAspectRatio: false,
      elements: {
        center: {
          text: center_text
        }
      },
      tooltips: {
        enabled: tooltip_enabled
      }
    }
  };
  return config;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<div class="col-lg-6" style="text-align: center;">
  <canvas id="my_chart" style="height: 160px; "></canvas>
</div>

Answer 1

请确保在画布上使用max-height样式。

例如：

<canvas id=“my_chart" style="max-height: 160px;"></canvas>

Answer 2

也请尝试使用百分比值而不是像素给出高度和宽度。