我用图表填充了窗口的高度和宽度。
在创建图表时,yaxes确实得到了一些选项,比如:
ticks: { display: true, min: 0, beginAtZero: true, max: 120, fontSize: 14 }
随着窗口大小的调整(即浏览器),窗口缩小得越小,图表的可用空间就越小,因为我的标题、x轴、两个y轴和图例的初始字体大小(虽然我没有在那里设置字体,但我希望你能设置)。
在我以前的花式图表(VisiFire)中,"免费",标题和轴的字体大小缩小了(当然也扩大了)。我也想在这里做同样的事。
如何做到这一点?
你知道,有点像:
chart.scales['y-axes-1'].options.ticks.fontSize = new_font_size
如果是,我会把它放在哪里?
我刚刚尝试了动画onProgress事件(对于currentStep 1),但我想已经太晚了(或者我不应该设置options.ticks.fontSize,而是其他内容)。我试图在动画onComplete之前找到一个事件,在那里我可以设置它。我设置了它,在当前步骤1之后的每一步,我都打印出字体大小,这是我的新字体大小,但它没有改变任何东西。
谢谢。
编辑:是不是我们不能更新ticks的fontSize?因为我刚试过这个:
chartInstance.scales['Dataset1'].options.ticks.fontSize = 24;
chartInstance.scales['Dataset1'].options.ticks.min = -100;
chartInstance.scales['Dataset1'].options.scaleLabel.labelString = 'foo bar';
chartInstance.scales['Dataset1'].options.scaleLabel.fontSize = 36;
它被更新到了-100的最小值,标签改为foo-bar,标签的fontSize跳到了36,但棒保持不变。他们没有达到24岁。
我这里有一把小提琴:http://jsfiddle.net/jmpxgufu/178/
这说明了我的意思。运行fiddle后,在5秒内(setInterval),它将执行更新。刻度刻度不会更新其fontSize。我使用的是:https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.min.js,当我使用2.4.0时,它确实有效。
我确实发现了一个错误,在这里确认为一个错误:https://github.com/chartjs/Chart.js/issues/4896
编辑:嗯,它被标记为一个bug!现在,看起来要么有一个解决方案,要么他们在2.7.0中改变了事情,现在这就是你设置它的方式,或者什么,但是。。。
它看起来像是使用了次要和主要:
myLiveChart.scales['Myaxs'].options.ticks.minor.fontSize=36