如何缩短我在 SVG 中使用的照片的链接？答案

【问题标题】：How can I shorten the link to the photo I used in my SVG?如何缩短我在 SVG 中使用的照片的链接？
【发布时间】：2020-01-10 04:10:05
【问题描述】：

我的 svg 中的照片链接超过 1,100 行代码。我很确定这是因为我在 Adobe Illustrator 中使用了图像跟踪工具，然后我在 Photoshop 中剪切了我想要的确切部分，然后我创建了 SVG。如果我唯一的选择是更有效地重新创建徽标，那很好。我想我只是希望有一个更简单的方法，因为我已经花了几个小时。

我一直在寻找优化它的方法，但没有找到任何特定于这种情况的东西。有没有人遇到过这种情况？

<image style="overflow:visible;" width="560" height="231" id="Layer_1_1_" 
xlink:href="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAi4AAADuCAYAAAAePYxCAAAACXBIWXMAABSbAAAUmwGHzxCEAAAA
GXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAABWT9JREFUeNrsvWmPJFl2JfZs8X33
2DPWjCUj11p6qapucro5I4kgZgiCGHAolhrQBwLzCwRhBG2j7YP0YT5QwAADQhI1gho1GpLAsLsF
LkOou9nd1d21dFVWVWYtmVWVlWtExubhsfhqZrrnvvfMzT08IjwiPLIiq+wlLH0Jd3OzZ8/ePe/c
e88VImxhC1vYwha2sIXtKWlG2AVh+6K0//af/w9WJBpJRGmLRWNWJpMx05lMwrKsJP3ZejJH4Ylm
0xGe5/X8jWazKRzHOfQzrtqnQ8891+Xf4PfpOb7fUM8bjYZwHXpsNppO09lpOM2a02i49NkmfW7H..." transform="matrix(0.5357 0 0 0.5504 6.5751 1.8521)">
</image>

显然我无法显示所有字符，但有超过 12,000 个字符，我们将不胜感激。

【问题讨论】：

您可能使用了滤镜和图层修改器，因此 Photoshop 对 svg 的部分进行了光栅化。您能否发布指向源文件的链接，以便我们更好地帮助您？
我已经弄明白了。我无知将我的 svg 放入 ps 以编辑亮度，然后将其放回原处。我刚刚撤消了这些更改并修复了它。

标签： html svg href xlink

【解决方案1】：

而不是使用 SVG 图像的 base64 源。只需使用 .svg 文件即可。

您可以在此处使用this tool 将您的 base64 日期转换回 SVG 文件。

然后您可以像这样轻松链接该文件：

<image style="overflow:visible;" width="560" height="231" id="Layer_1_1_" xlink:href="https://example.com/someimage.svg" transform="matrix(0.5357 0 0 0.5504 6.5751 1.8521)">
</image>

【讨论】：