chart.js纵横比不是正方形

Question

我正在尝试绘制线图，但我要求x和y轴以y为单位2到x单位1的比率为正方形

换句话说

y轴上的单位读数2应与x轴上读数1的距离相等

我已将画布设置为宽度和高度的100％

我有以下

ticks: {
  beginAtZero: true,
  scaleStepWidth:1,
  stepSize: 1,
  scaleSteps:7,
  steps: 7

}

and

ticks: {
  beginAtZero: true,
  scaleStepWidth:1,
  stepSize: 1,
  scaleSteps:14,
  steps: 14

}

在许多其他尝试中，但没有一个似乎有所作为

这是我的图表

y轴为1的“正方形”与x轴为0.5的“正方形”在y上为4.9cm，在x上为4.6cm，我试图将其设为精确的正方形

任何人都可以帮忙吗？

由于

Answer 1

我遇到了类似的问题，需要保持1：1的比例，最后通过使x和y轴的长度相等来解决该问题：

      // Make the length of the x and y-axis equal
      const xLength = totalXMax - totalXMin;
      const yLength = totalYMax - totalYMin;
      if (xLength > yLength) {
        const difference = xLength - yLength;
        totalYMax = totalYMax + difference / 2;
        totalYMin = totalYMin - difference / 2;
      } else {
        const difference = yLength - xLength;
        totalXMax = totalXMax + difference / 2;
        totalXMin = totalXMin - difference / 2;
      }

      // Set the new min and max on the chart instance
      instance.chart.options.scales.xAxes[0].ticks.min = totalXMin;
      instance.chart.options.scales.xAxes[0].ticks.max = totalXMax;
      instance.chart.options.scales.yAxes[0].ticks.min = totalYMin;
      instance.chart.options.scales.yAxes[0].ticks.max = totalYMax;

要在用户调整窗口大小时仍保持图表方形，请将以下选项添加到图表配置中：

        ...
        maintainAspectRatio: true,
        aspectRatio: 1,
        ...

对于2：1的比率，请将aspectRatio设置为2。请参见https://www.chartjs.org/docs/latest/general/responsive.html