如何让我的图表轴使用相同的缩放比例？

Question

使用Chart.js，我做了一个散点图。图表上的点将始终位于轴上。目前，我正在使用以下选项和数据：

public scatterChartLabels:string[] = ['Experiencing', 'Ideation', 'Thinking', 'Evaluation'];

public scatterChartData = [
    {
      x: 0,
      y: localStorage.getItem('col1')
    }, {
      x: localStorage.getItem('col2'),
      y: 0
    }, {
      x: 0,
      y:  - localStorage.getItem('col3')
    },
    {
      x: - localStorage.getItem('col4'),
      y: 0
    },
    {
      x: 0,
      y: localStorage.getItem('col1')
    }
  ]

  public scatterChartOptions = {
    showLines: true,
    yAxes: {
      gridLines: {
        zeroLineWidth: 100
      }
    },
    scales: {
      xAxes: [{
        gridLines: {
          zeroLineColor: '#c1272d'
        },
      }],
      yAxes: [{
        gridLines: {
          zeroLineColor: '#c1272d'
        }
      }],
    }
  }

  public scatterChartType: string = 'scatter';

  public scatterChartCustomColors = [{
    backgroundColor: 'rgba(255, 147, 29, 0.5)',
    borderColor: 'rgba(255, 147, 29)',
    pointBackgroundColor: 'rgba(255, 147, 29, 0.5)',
    pointBorderColor: 'rgba(255, 255, 255)'
  }]

这将生成以下图表：

如何让图表在两个轴上使用相同的刻度？例如，如果最高的 y-axis 值为 130，我怎样才能使最低的 y-axis 为 130，而 x-axis 为 -130 和 130？

Answer 1

我能够通过更新每个轴的刻度设置来做到这一点：

public scatterChartOptions = {
    ...
    scales: {
      xAxes: [{
        ticks: {
          min : - 130,
          max : 130
        }
      }],
      yAxes: [{
        ticks: {
          min : - 130,
          max : 130
        }
      }]
    }
  }

如何让我的图表轴使用相同的缩放比例？

How can I make my chart's axes use the same proportions for scaling?

chart.js

ng2-charts