在IE8显示联SVG [英] Display inline SVG in IE8

问题描述

我想显示SVG联图形，并使其与IE8的合作。

I'm trying to display an SVG inline graphic and make it work with IE8.

我已经阅读了很多问题，在这里如何使之与raphael.js，谷歌svgweb和svg2vml工作。所有这些作品对我的SVG的，我不知道发生了什么。

I have read a lot of questions here about how to make it work with raphael.js, google svgweb and svg2vml. None of these works for my svg, I don't know what's happening.

这是我如何显示它（它的工作原理与除IE8的所有浏览器）：

This is how I'm displaying it (it works with all browsers except IE8):

<svg class="graph_svg" xmlns="http://www.w3.org/2000/svg">

<path style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-linejoin: round;" fill="none" stroke="#4da1dc" d="M42,212C42,212,56.58154127864968,178.90693259497436,67,
172C77.41845872135032,165.09306740502564,79.5,168,92,
168C104.5,168,106.19916961436985,178.29222241984883,117,
172C127.80083038563015,165.70777758015117,133.4183216333031,114.08871808400757,142,
105C150.5816783666969,95.91128191599243,157.87272431184198,102.54065796718027,167,
94C175.7621846606317,85.80096835150695,179.03606043337788,80.070403288402034,191,
80C203.4624370485647,80.968329907914544,210.99663342191394,110.54503064668913,216,
122C221.00336657808606,133.45496935331087,228.50577118340374,167.62020231894422,241,
168C253.49422881659626,168.37979768105578,255.06696898441479,134.05960665491182,266,
128C276.93303101558524,121.94039334508818,279.00302316511863,131.51034853302625,291,
128C302.99697683488137,124.48965146697377,305.02744887853777,117.98774764722916,316,
112C326.53364907660375,106.25176225866002,331.73815989512775,109.70298788241857,340,
101C348.60608344257525,100.93438762248067,352.5800686286496,100.58744744135072,365,
100C377.4199313713504,100.41255255864928,377.50034068226495,132.0922872719254,390,
132C402.49965931773505,132.9077127280746,402.5282295422324,90.83960803280808,415,
80C427.4717704577676,80.16039196719192,436.6882768782747,97.94668137129736,440,
110C443.3117231217253,122.05331862870264,452.5179069815616,132.3311548168279,465,
132C477.4820930184384,132.66884518317212,477.5053977819771,137.63269166443368,490,
138C501.994818129302,118.35261600214366,502.01756477464437,125.64903472184167,539,
92C551.4723045035353,91.16836283687255,559.1649335027082,151" stroke-width="1" stroke-linejoin="round">
</path>

<circle class="graph_circle" cx="42" cy="212" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="67" cy="172" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="92" cy="168" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="117" cy="172" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="142" cy="105" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="167" cy="94" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="191" cy="80" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="216" cy="122" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="241" cy="168" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="266" cy="128" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="291" cy="128" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="316" cy="112" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="340" cy="101" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="365" cy="100" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="390" cy="132" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="415" cy="80" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="440" cy="110" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="465" cy="132" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="490" cy="138" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>
<circle class="graph_circle" cx="539" cy="92" r="2" fill="#4da1dc" stroke="#4da1dc" stroke-width="2"></circle>

</svg>
</div><!-- holder -->

如何使其与IE8的工作有什么建议？

Any suggestion on how to make it work with IE8?

推荐答案

IE8根本无法做到这一点，你需要做的SVG的外部文件，并为它服务＆LT;对象＆gt; （例如）。

IE8 simply can't do this, you would need to make the svg an external file and serve it with <object> (for example).

http://caniuse.com/#feat=svg-html5

这篇关于在IE8显示联SVG的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！