首页 > 解决方案 > 保存包含相对路径的 SVG

问题描述

我有以下内联代码:

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
....
<svg width="1152" height="648" viewBox="0 0 1152 648" aria-describedby="title" id="svg">
    <title id="title">Supporter Plan</title>

    <image xlink:href="../images/Image1.png" x="0" y="0" width="100%" height="100%"></image>
    <image xlink:href="../images/Image2.png" x="0" y="0" width="100%" height="100%"></image>

    <foreignobject x="190" y="177" width="811" height="373">
        <body xmlns="http://www.w3.org/1999/xhtml">
        <iframe style="border: none" src="../fo.html" scrolling="no" width="100%" height="100%">

        </iframe>
        </body>

    </foreignobject>
</svg>
...
</body>
</html>

我想将创建的图像保存为文件。但是,如果我通过创建带有所需标题的 svg 内容的链接来保存它var url = "data:image/svg+xml;charset=utf-8,"+encodeURIComponent(source);source则创建的文件不会评估图像或 iframe。

我该如何解决这个问题?

标签: htmlsvgrelative-pathsave-as

解决方案


推荐阅读