Question

我有一个自定义SVG图标，我想添加到我的本地fontawesome库（fontawesome-all.js），我根据此处提供的说明将其包含在我的项目资源文件夹中：

但是，我无法理解写入此库中的图标以在网页上显示它们的格式。我的SVG图标使用标签以标准SVG格式编写。任何人都可以告诉我在这个库中包含我的SVG图标的方法或者将我的SVG图标转换为自定义fontawesome图标的替代方法吗？谢谢。

Answer 1

你的svg标签可能看起来像这样

<svg width='200' height='200' fill="#000000" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><path fill="#000000" d="M91.5...48.1z"/></svg>

在你当地的fontawesome图书馆（fontawesome-all.js）搜索“var icons”然后复制图标数组中的任何元素（例如：“yen-sign”：[...]）并用你的名字替换名字想要，但是当你在html中调用你的图标时它将是后缀（例如：“myicon”：[...] =＆gt; <i class="fa fa-myicon"></i>
两个第一个数字是“viewBox”svg属性的值（例如：100,100 =＆gt; viewBox =“0 0 100 100”）
将所有“d”svg属性复制到引号内（“M91.5 ... 48.1z”=＆gt; d =“M91.5 ... 48.1z”）

最后 var icons = {...，“myicon”：[100,100，[]，“”，“M91.5 ... 48.1z”]}

只留下第3个（数组）和第4个元素（应该是图标的unicode值，在我们的例子中，我们不能将我们的图标添加到FA字体）的图标定义为空！这些不会影响你的svg渲染！

如何将自定义SVG图标添加到本地fontawesome库（fontawesome-all.js）？

1 个答案: