在chart.js中,我如何设置x轴标签的字体大小而不触及全局配置?我已经试过设置我的选项对象的“scaleFontSize”选项。我还试过设置:
{ ... scales: { xAxes: [{ scaleFontSize: 40 ... }] } }
y0u0uwnf1#
fontSize属性实际上在scales.xAxes.ticks中,而不是您所想的scales.xAxes中。因此,您只需编辑属性,如下所示:
fontSize
scales.xAxes.ticks
scales.xAxes
var options = { scales: { yAxes: [{ ticks: { fontSize: 40 } }] } }
您可以看到fully working example in this jsFiddle,其结果如下:
kqlmhetl2#
chartjs 3.0的配置选项和属性已更改。当前我使用的是Chartjs 3.1.1。Fonts现在用作对象。要更改x轴刻度的字体大小,您必须使用以下配置。
var options = { scales: { x: { ticks: { font: { size: 12, } } } } };
请检查这个jsfiddle范例。
bgibtngc3#
试试看这个有用吗
options: { scales: { xAxes: [{ ticks: { fontSize: 10 } }] } }
d4so4syb4#
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' } } } } }
91zkwejq5#
试试看这样行不行
{ ... scales: { xAxes: [{ fontSize: 40 ... }] } }
scaleFontSize似乎不是有效的属性。
scaleFontSize
ttygqcqt6#
试试这个
Chart.defaults.global.defaultFontSize = 8;
bejyjqdl7#
请尝试以下简单的解决方案:
myChart.options.scales.yAxes[0].ticks.fontSize = 40 ; myChart.update();
5t7ly7z58#
目前,我使用的是^2.9.4 chart.js。我已经尝试过这里发布的其他解决方案,并做了一些调整。
options: { scales: { yAxes: [{ ticks: { minor: { fontSize: 16 } } }], xAxes: [{ ticks: { minor: { fontSize: 16 } } }] } }
8条答案
按热度按时间y0u0uwnf1#
fontSize
属性实际上在scales.xAxes.ticks
中,而不是您所想的scales.xAxes
中。因此,您只需编辑属性,如下所示:
您可以看到fully working example in this jsFiddle,其结果如下:
kqlmhetl2#
chartjs 3.0的配置选项和属性已更改。当前我使用的是Chartjs 3.1.1。Fonts现在用作对象。要更改x轴刻度的字体大小,您必须使用以下配置。
请检查这个jsfiddle范例。
bgibtngc3#
试试看这个有用吗
d4so4syb4#
91zkwejq5#
试试看这样行不行
scaleFontSize
似乎不是有效的属性。ttygqcqt6#
试试这个
bejyjqdl7#
请尝试以下简单的解决方案:
5t7ly7z58#
目前,我使用的是^2.9.4 chart.js。我已经尝试过这里发布的其他解决方案,并做了一些调整。