我对您的代码进行了以下更改，以便刻度更接近我的期望：主y轴范围从0到100，步长为20，辅助y轴（“total”）范围从0到5，步长为1。
我更改了Y轴比例配置，如下所示
添加了明确的min和max值：

min: 0,   // Minimum value
max: 100, // Maximum value

字符串
调整stepSize：

ticks: {
    count: 5,
    beginAtZero: true,
    autoSkip: false, 
    stepSize: 20,
}

型
total规模配置：

min: 0,   // Minimum value
max: 5,   // Maximum value

型
将stepSize更改为1，以获得一致的单调增量：

ticks: {
    count: 5,
    autoSkip: false,
    stepSize: 1,
}

型

var data = {
  labels: ["x1", "x2", "x3"],
  datasets: [{
    label: "First",
    backgroundColor: 'rgba(255, 99, 132, 0.2)',
    borderWidth: 1,
    data: [3, 20, 30],
    barPercentage: 0.3,
  },
  {
    label: "Second",
    backgroundColor: 'green',
    borderWidth: 1,
    data: [3, 7, 9],
    barPercentage: 0.3,
  },
  {
    label: "Third",
    backgroundColor: 'rgba(255, 206, 86, 0.2)',
    borderWidth: 1,
    data: [3, 3, 3],
    barPercentage: 0.5,
    yAxisID: "total"
  }]
};

var options = {
  toolbar: {
      show: false
  },
  fill: {
    type: "gradient",
    gradient: {
      shadeIntensity: 1,
      opacityFrom: 0.5,
      opacityTo: 0.5,
      stops: [0, 100]
    }
  },
 scales: {
    x: {
      stacked: true,
      barThickness: 30,
    }, 
    y: {
      min: 0,   // Minimum value
      max: 100, // Maximum value
      stacked: true,
      ticks: {
        count: 5,
        beginAtZero: true,
        autoSkip: false, 
        stepSize: 20,
      },
      grid: {
        drawBorder: false
      }
    },
    total: {
      min: 0,   // Minimum value
      max: 5,   // Maximum value
      display: true,
      ticks: {
        count: 5,
        autoSkip: false,
        stepSize: 1,
      },
      beginAtZero: true,
      position: 'right',
    }
}

};

var ctx = document.getElementById("myChart").getContext("2d");
var myBarChart = new Chart(ctx, {
  type: 'bar',
  data: data,
  options: options
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script>

<canvas id="myChart" width="500" height="100"></canvas>