1

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

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

4

1 回答 1

5

pointsapolyline中,逗号位于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">
于 2013-11-04T12:08:20.930 回答