svg fill-rule应用于两个或多个多边形

Question

我正在尝试将svg evenodd fill-rule应用于两个或多个多边形中，一个在另一个内部/与另一个相交。

在example中，我希望小多边形立方体为白色。

<svg height="500" width="500" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" >
 <polygon points="100,100,300,100,300,300,100,300"/>  
 <polygon points="150,150,200,150,200,200,150,200" />  
</svg>

如何使用fill-rule属性实现此目的？

我应该使用其他形状吗？

请记住，为了构造任何形状，我将不得不使用points属性来提供形状的坐标。