将HTML页面中包含的SVG加载到.aspx页面

时间:2017-10-13 05:42:52

标签: html css asp.net svg

我有一个 svg.html 文件,其中svg内容在 元素中定义。 我已经在互联网上梳理了3天,还没有找到解决方案,为什么我使用的图标不会显示在呈现的 .aspx 网页上。 svg.html看起来像这样:

<div class="svg-icons">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="svg-icons">
<symbol id="icon-menu" viewBox="0 0 18 18">
<path d="##path value##"></path>
</symbol>
</svg>
</div>

我尝试了以下内容:

  1. 使用引用svg.html的<object></object>标记。
  2. <use>标签。
  3. 在web.config <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
  4. 我做错了什么?

    请注意,我无法更改svg.html文件,这是 ASP.Net网络表单的项目。

1 个答案:

答案 0 :(得分:1)

如果你在包含SVG图像的html文件中有完整的标记,你可以放置一个文字控件&amp;通过使用正则表达式删除不必要的标记来从后面的代码中分配HTML页面内容:

<强> ASPX

<asp:Literal ID="placeholder" runat="server" />

<强>代码隐藏

protected void Page_Load(object sender, EventArgs e)
{
    string html;
    using (StreamReader sr = File.OpenText(Server.MapPath("~/path_to_html_file.html"))
    {
        html = sr.ReadToEnd();
        sr.Close();
    }

    Regex start = new Regex(@"[\s\S]*<body[^<]*>", RegexOptions.IgnoreCase);
    html = start.Replace(html, "");
    Regex end = new Regex(@"</body[\s\S]*", RegexOptions.IgnoreCase);
    html = end.Replace(html, "");

    placeholder.Text = html;

}

如果您有原始SVG文件并希望在文字标记元素中使用它,则可以在用户控件中使用<iframe src="/path_to_SVG_file.svg" /> / <embed src="/path_to_SVG_file.svg" />,或者使用{{1}分配div属性:

<强> ASPX

InnerHtml

<强>代码隐藏

<div id="placeholder" runat="server"></div>

参考文献:

Include contents of an html page in an aspx page

Interactive Mapping Using SVG & ASP.NET