有时候在绘制 canvas 的时候可能会用到一些特殊字体。而中文字体例如是用类似谷歌字体加载的话,可能会是分段加载,DOM 不一定会加载过某些字体从而导致在绘制 canvas 时出现字体缺失。
这个时候可以使用如下代码预加载 css 中的字体
document.fonts.load
实际使用案例:
const loadTextFont = async (fontSize, text) => {
await document.fonts.load(`${fontSize}px Noto Sans SC`, text).catch((e) => {
console.err……