多层 <svg> 多边形 - 不工作

Question

如何在同一 SVG 中添加多层 SVG 多边形？例如，我这里有一张汽车图（见代码片段），如果我想在上面添加 window 怎么办？如果我在汽车标记下方写下新的 window 标记（请参阅代码片段），它是不可见的。如果我把它写在上面，汽车标记就会被覆盖。

<svg heght="100" width="100">
<!--bil-->  
<polygon points="0,100 0,70 5,65 20,65 30,40 70,40 80,65 95,65 100,70 100,100 90,100 80,90 70,100 30,100 20,90 10,100" style="fill:#777; stroke:#444; stroke-width:3px;">
  
<!--window-->  
<polygon points="30,30 50,30 50,50 30,50" style="fill:blue; stroke:#444; stroke-width:3px;">  

</svg>

Answer 1

在 SVG 中，您必须使用 /> 或结束标记正确终止元素，例如</polygon>

html 解析器正在将您当前的标记解析为不允许的嵌套多边形。

您的 window 位置不对，但至少现在可以看到了。

<svg heght="100" width="100">
<!--bil-->  
<polygon points="0,100 0,70 5,65 20,65 30,40 70,40 80,65 95,65 100,70 100,100 90,100 80,90 70,100 30,100 20,90 10,100" style="fill:#777; stroke:#444; stroke-width:3px;"/>
  
<!--window-->  
<polygon points="30,30 50,30 50,50 30,50" style="fill:blue; stroke:#444; stroke-width:3px;"/>  

</svg>

多层 <svg> 多边形 - 不工作

Multiple Layers Of <svg> polygons - Not Working

html

svg

polygon

layer