如何在画布中使用材质图标？答案

【问题标题】：How to use material icons in canvas?如何在画布中使用材质图标？
【发布时间】：2019-10-08 21:45:20
【问题描述】：

如何在画布中使用材质图标？

对于 fontawesome，您可以包含字体并使用图标字符代码，例如：

ctx.font='30px FontAwesome';
ctx.fillText('\uF047',20,50);

但是 Google 素材图标呢？我在网上找不到任何解决方案。

【问题讨论】：

您可以获取 SVG 格式的 Google 素材图标。请看XMLSerializer.serializeToString()和encodeURIComponent

【解决方案1】：

如果你已经加载了字体，你可以像 FontAwesome 一样使用它。您只需使用图标的名称，而不是 unicode 字符串。

context.font = '24px Material Icons';
ctx.fillText('calendar_today',20,50);

【讨论】：

【解决方案2】：

如果你还在找，我在这里找到了答案：

简而言之：它使用FontFace 对象来加载材质图标。然后使用画布上下文中的fillText 方法来绘制图标。

【讨论】：