SVG无法在Mozilla Firefox中运行

Question

我是SVG的新手,这是我的SVG代码:

<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>

我正在尝试为我的网站制作分析表,并且它在这个链接上看起来像img http://1zh.us/examples/svg.jpg 这是代码http://1zh.us/examples/svg的链接. html 它在IE和Chrome中工作但不在mozilla firefox中.我做错了什么???

Answer 1

在points一个polyline逗号之间去x和y值,空格分隔的点.

<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">