2013-11-04 61 views
1

我与SVG是一个新手,这是我的SVG代码:SVG在Mozilla不工作的Firefox

<div style="width:650px;"> 
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
<rect width="640" height="200" style="fill:#ddd;"></rect> 
<polyline points="0 200,20 200, 40 200, 60 200, 80 200, 100 200, 120 200, 140 200, 160 200, 180 200, 200 200, 220 200, 240 200, 260 200, 280 200, 300 200, 320 200, 340 200, 360 200, 380 200, 400 200, 420 200, 440 200, 460 101, 480 200, 500 200, 520 2, 540 35, 560 167, 580 167, 600 200, 620 167, 640 200, 640 200" style="fill:blue; stroke:grey; stroke-width:3; opacity:0.4;"></polyline> 
</svg></div> 

我试图做分析表为我的网站,它shuold样子的img这个链接http://1zh.us/examples/svg.jpg上 这是代码http://1zh.us/examples/svg.html的链接 它在IE和Chrome中工作,但不在Mozilla Firefox中。 我做错了什么?

+1

请把一些精力投入到你的问题,并解释你的问题是什么。我们不应该仅仅为了了解问题的关键就自己测试一下。 –

+0

Alvaro我做了一些编辑,但我不知道确切的问题是什么。它只是不显示在Firefox中正确的大小,并没有折线。 – mandza

+1

确切的问题是''不能在Firefox中呈现;只有''出现;-) –

回答

5

在的一个polyline逗号之间的逗号之间的值为xy值,空格分隔点。

<polyline points="0,200 20,200 40,200 60,200 80,200 100,200 120,200 140,200 160,200 
180,200 200,200 220,200 240,200 260,200 280,200 300,200 320,200 340,200 360,200 380,200 
400,200 420,200 440,200 460,101 480,200 500,200 520,2 540,35 560,167 580,167 600,200 
620,167 640,200 640,200" 
style="fill:blue; stroke:grey; stroke-width:3; opacity:0.4;"> 
</polyline> 

你也需要让你的SVG元素大到足以容纳你的polyline

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" height="200" width="640"> 
+0

非常感谢,它解决了我的问题 – mandza

相关问题