帶空洞的SVG多邊形

帶有洞的多邊形應該如何用svg建模？無法找到任何東西。帶空洞的SVG多邊形

2017-10-18 Per

我掩蓋path：

<!DOCTYPE html> 
 
<html> 
 
    <body> 
 
    <svg width="300" height="300"> 
 
     <defs> 
 
     <mask id="mask" > 
 
      <path d="M10 150L10 290L290 290L290 150,L10,150C10 -50,290 -50,290 150Z" fill="white"></path> 
 
      <rect x="30" y="150" width="240" height="120" /> 
 
      <circle cx="150" cy="70" r="60"></circle> 
 
     </mask> 
 
     </defs> 
 
     <rect width="300" height="300" x="0" y="0" mask="url(#mask)" style="fill:steelblue" ></rect> 
 
    </svg> 
 
    </body> 
 
</html>

來源

2017-10-18 16:07:27 Mark

帶空洞的SVG多邊形

回答

相關問題