Question

我有以下Inkscape导出的SVG：

[TESTSVG.HTML]

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="744.09448819"
   height="1052.3622047"
   id="svg2"
   version="1.1"
   inkscape:version="0.48.4 r9939"
   sodipodi:docname="mainscreen.svg">
  <defs
     id="defs4" />
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="0.7"
     inkscape:cx="175.99454"
     inkscape:cy="739.86976"
     inkscape:document-units="px"
     inkscape:current-layer="layer1"
     showgrid="false"
     inkscape:window-width="1366"
     inkscape:window-height="706"
     inkscape:window-x="-8"
     inkscape:window-y="-8"
     inkscape:window-maximized="1" />
  <metadata
     id="metadata7">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
        <dc:title />
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <path
       sodipodi:type="arc"
       style="fill:#ff0000;fill-opacity:1;stroke:#495677;stroke-width:23.16900062999999900;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
       id="circle1"
       sodipodi:cx="227.14285"
       sodipodi:cy="156.6479"
       sodipodi:rx="47.142857"
       sodipodi:ry="44.285713"
       d="m 274.28571,156.6479 a 47.142857,44.285713 0 1 1 -94.28571,0 47.142857,44.285713 0 1 1 94.28571,0 z"
       inkscape:label="#path2985" />
    <rect
       style="fill:#ffff00;fill-opacity:1;stroke:#495677;stroke-width:4.86899999999999980;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
       id="box1"
       width="284.28571"
       height="110"
       x="312.85715"
       y="98.076469"
       inkscape:label="#box1" />
  </g>
</svg>

另存为HTML文件（TESTSVG.HTML），它适用于Chrome，但不适用于IE9。如果您将文件名更改为.SVG（TESTSVG.SVG），它将适用于两种浏览器。

我需要使用HTML扩展程序在IE9上运行它。

请求任何帮助。

Answer 1

您可以添加这样的HTML DTD并嵌入SVG（在IE10中工作 - 无法在9中测试）应该工作我认为

<!DOCTYPE html>
<html>
<body>

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="744.09448819"
   height="1052.3622047"
   id="svg2"
   version="1.1"
   inkscape:version="0.48.4 r9939"
   sodipodi:docname="mainscreen.svg">
  <defs
     id="defs4" />
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="0.7"
     inkscape:cx="175.99454"
     inkscape:cy="739.86976"
     inkscape:document-units="px"
     inkscape:current-layer="layer1"
     showgrid="false"
     inkscape:window-width="1366"
     inkscape:window-height="706"
     inkscape:window-x="-8"
     inkscape:window-y="-8"
     inkscape:window-maximized="1" />
  <metadata
     id="metadata7">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
        <dc:title />
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <path
       sodipodi:type="arc"
       style="fill:#ff0000;fill-opacity:1;stroke:#495677;stroke-

width:23.16900062999999900;stroke-linecap:butt;stroke-

linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-

dasharray:none"
       id="circle1"
       sodipodi:cx="227.14285"
       sodipodi:cy="156.6479"
       sodipodi:rx="47.142857"
       sodipodi:ry="44.285713"
       d="m 274.28571,156.6479 a 47.142857,44.285713 0 1 1 -94.28571,0 

47.142857,44.285713 0 1 1 94.28571,0 z"
       inkscape:label="#path2985" />
    <rect
       style="fill:#ffff00;fill-opacity:1;stroke:#495677;stroke-

width:4.86899999999999980;stroke-linecap:round;stroke-

linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-

dasharray:none"
       id="box1"
       width="284.28571"
       height="110"
       x="312.85715"
       y="98.076469"
       inkscape:label="#box1" />
  </g>
</svg>

</body>
</html>

Answer 2

如果有两个文件是可以接受的，您可以执行以下操作（在IE9中测试）。在这种情况下，您将SVG保存为test.svg：

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<object data='test.svg'></object>  



</body>
</html>

Answer 3

我遇到了同样的问题 - 当代码以HTML格式内联实现时，IE9拒绝从InkScape渲染svg。

问题是标记<sodipodi:namedview以及此处的所有内容，直到结束标记/>

尝试删除它，我敢打赌，当在IE9中调用HTML时，svg将呈现。

Answer 4

这是因为IE9中无法识别inkscape和sodipodi，尤其是内联SVG。这就是他们需要被删除的原因。您可以参考此链接Simple SVG Display

Inkscape .HTML SVG文件适用于Chrome，但不适用于IE9

4 个答案: