Chart.js轴标签字体大小

Question

在chart.js中,如何在不触及全局配置的情况下为x轴标签设置字体大小？

我已经尝试过设置'scaleFontSize'选项我的选项对象.我也尝试过设置:

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

Answer 1

该fontSize属性实际上是在你的想法scales.xAxes.ticks而不在scales.xAxes你的想法中.

所以你只需要像这样编辑属性:

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

你可以在这个jsFiddle中看到一个完整的例子,结果如下:

Answer 2

options: {
                  locale: 'fa-IR',
                  responsive: true, // Instruct chart js to respond nicely.
                  maintainAspectRatio: false, // Add to prevent default behaviour of full-width/height 
                        plugins: {
                          legend: {
                              position: 'top',
                              labels: {
                                  font: {
                                    size: 9,
                                    family:'vazir'
                                  }
                             }
                          },
                          title: {
                            display: true,
                            text: chart_info.chartTitle,
                            font: {
                                size: 16,
                                family:'vazir'
                            }
                          },
                          tooltip: {
                              bodyFont: {
                                size: 13,
                                family:'vazir'
                              }
                         }
                    },
                    scales: {
                        x: {
                            ticks: {
                                font: {
                                    size: 10,
                                    family:'vazir'
                                }
                            }
                        },
                        y: {
                            ticks: {
                                font: {
                                    size: 10,
                                    family:'vazir'
                                }
                            }
                        }                       
                    }
                }

Answer 3

chartjs 3.0 的配置选项和属性已更改。目前我正在使用 Chartjs 3.1.1。字体现在用作对象。为了更改 x 轴刻度的字体大小，您必须使用以下配置。

var options = {
    scales: {
        x: {
            ticks: {
                font: {
                    size: 12,
                }
            }
        }
    }
};

查看此jsfiddle示例。

Answer 4

试试这个有效

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