轴位置居中时,ChartJS x轴标题不可见

u3r8eeie  于 2022-10-02  发布在  Java
关注(0)|答案(2)|浏览(113)

当位置未居中时,标题可见。

但如果x轴位置居中,则标题将消失。

以下是我的Chartjs选项。文档似乎没有解决此问题的可行选项。

const options = {
    maintainAspectRatio: false,

    scales: {
      x: {
        type: 'linear',
        min: 0,
        max: MAX_AGE,
        grid: {
          display: false,
        },
        title: {
          display: true,
          text: 'xaxis title',
        },
        position: 'center', // what can I do to view the x-axis tile when axis is centered.
      },
      y: {
        min: -10,
        max: 10,
        grid: {
          display: false,
        },
        title: {
          display: true,
          text: 'yaxis title',
        },
      },
    },
}
aelbi1ox

aelbi1ox1#

我假设您使用的chart.js版本低于3.5,因为这是一个已在3.5版本中解决的错误,pr:https://github.com/chartjs/Chart.js/pull/9413

因此,要解决您的问题,您需要更新到最新版本的chart.js

tquggr8v

tquggr8v2#

在Chartjs的v2中,图表标题选项也发生了相当大的变化。我发现标题完全隐藏了,直到我添加了填充-举个例子

options: {
      plugins: { 
        title: {
          display: true, 
          text: "Title" ,
          padding: {
              top: 10,
              bottom: 10
          },
          font: {
            size: 24,
            style: 'italic',
            family: 'Helvetica Neue'
          }
        }
      },
      ... other options here
}

相关问题