图表。js坐标轴标记字体大小

时间:2022-12-04 09:57:52

In chart.js how can I set the set the font size for just the x axis labels without touching global config?

在图表。如何在不使用全局配置的情况下为x轴标签设置字体大小?

I've already tried setting the 'scaleFontSize' option my options object. I've also tried setting:

我已经尝试过设置“scaleFontSize”选项my options对象。我也试过设置:

{
  ...
  scales: {
    xAxes: [{
      scaleFontSize: 40
      ...
    }]
   }
}

4 个解决方案

#1


33  

The fontSize attribute is actually in scales.xAxes.ticks and not in scales.xAxes as you thought.

fontSize属性实际上是在scale . xaxes中。扁虱,而不是鳞片。像你想的xAxes。

So you just have to edit the attribute like this :

你只需要编辑属性如下:

var options = {
    scales: {
        yAxes: [{
            ticks: {
                fontSize: 40
            }
        }]
    }
}


You can see a fully working example in this jsFiddle and here is its result :

图表。js坐标轴标记字体大小

#2


5  

Try this is working

试试这个工作

     options: {
        scales: {
           xAxes: [{
                   ticks: {
                    fontSize: 10
                   }
                  }]
                }
             }

#3


1  

Try to see if this will work

试着看看这是否行得通

{
  ...
  scales: {
    xAxes: [{
      fontSize: 40
      ...
    }]
   }
}

It doesn't look like scaleFontSize is a valid property.

它看起来不像scaleFontSize是一个有效的属性。

#4


0  

Try this simple solution:

试试这个简单的解决方案:

myChart.options.scales.yAxes[0].ticks.fontSize = 40 ;

myChart.update();

#1


33  

The fontSize attribute is actually in scales.xAxes.ticks and not in scales.xAxes as you thought.

fontSize属性实际上是在scale . xaxes中。扁虱,而不是鳞片。像你想的xAxes。

So you just have to edit the attribute like this :

你只需要编辑属性如下:

var options = {
    scales: {
        yAxes: [{
            ticks: {
                fontSize: 40
            }
        }]
    }
}


You can see a fully working example in this jsFiddle and here is its result :

图表。js坐标轴标记字体大小

#2


5  

Try this is working

试试这个工作

     options: {
        scales: {
           xAxes: [{
                   ticks: {
                    fontSize: 10
                   }
                  }]
                }
             }

#3


1  

Try to see if this will work

试着看看这是否行得通

{
  ...
  scales: {
    xAxes: [{
      fontSize: 40
      ...
    }]
   }
}

It doesn't look like scaleFontSize is a valid property.

它看起来不像scaleFontSize是一个有效的属性。

#4


0  

Try this simple solution:

试试这个简单的解决方案:

myChart.options.scales.yAxes[0].ticks.fontSize = 40 ;

myChart.update();