如何添加空间到开始和结束的x轴在chartjs上React....我已经尝试使用“偏移:真”,但它不工作,如果标签是更多

nkkqxpd9  于 2022-11-06  发布在  Chart.js
关注(0)|答案(1)|浏览(158)

目前它看起来像-https://mm5qkg.csb.app/---sandbox
如果标注数量较少,则使用“offset:true”有效,但标注数量开始增加时,偏移量也开始减少
"我试过很多方法,但都没用"

  • 我将其与react-chartjs-2配合使用 *
332nm8kg

332nm8kg1#

X轴可以定义为type: 'linear'data作为对象数组,每个对象都有xy属性。然后,可以使用ticks.minticks.max定义图表中应显示的范围。

const values = [0, 53, 85, 0, 0, 65, 5, 18, 2, 44, 2, 2, 42, 44, 21, 55];

const valueXStart = 4;

const options = {
  scales: {
    xAxes: [
      {
        type: 'linear',
        ticks: {
          min: 3.8,
          max: 7,
          stepSize: 0.1
        }
      }
    ]
  }
};

const data = {
  datasets: [
    {
      label: "First dataset",
      data: values.map((v, i) => ({ x: valueXStart + i * 0.1, y: v })),
      ...
    }
  ]
};

请看一下您修改后的CodeSandbox,看看它是如何工作的。

相关问题