如何根据屏幕尺寸在chart.js中更改字体大小

r1zhe5dt 于 2023-10-18 发布在 Chart.js

关注(0)|答案(1)|浏览(191)

我需要根据屏幕大小更改我使用Excelchart.js创建的图表中文本的字体大小，但我不知道如何操作。
我试着用tailwindcss并给父标记一个类来做这件事，但问题没有解决。

<div class="text-md sm:text-lg ">
   <canvas id="chart">
   </canvas>
</div>

编辑：我解决这个问题的方法是将responsive: true添加到options。问题解决了，但有更好的方法吗？

1条答案

除了建议之外，你还做了什么？
根据文档，“text-aa”标签控制字体大小
参考：https://tailwindcss.com/docs/font-size#setting-the-font-size
Eg

<div class="text-sm">
    <canvas id="chart"></canvas>
</div>

或者你可以使用“text-base”，我在文档中找不到“text-md”？
请注意，“md：text-lg”会增加中到大屏幕上的字体大小
md前缀是中等（屏幕）查询