如何只在特定區域內繪製圓形？

Question

所以我有一個畫在畫布上的圓，它根據設置改變大小。但是，如果該設置設置得太高，則該圓比保留區大，並且與畫布中的其他內容重疊。

我現在正在清除盒子周圍的區域，但它會導致困難。我基本上必須畫兩次，因爲我需要最後繪製圓。這使得在所述周圍區域中實施點擊動作更困難，因爲點擊被註冊兩次。

TL; RD：我怎樣才能掩蓋掉一部分圓之前我在畫布上繪製它？

Answer 1

爲此，您可以使用clip（）函數。

 context.rect(50,50,200,200);//the area in which the circle is to be drawn 
     context.save();//saved context so it can be restored later 
     context.clip(); 
     //now draw your circle 
     context.restore(); //remove the clip 

只繪製給定矩形內的區域。

這是關於這個問題的good tutorial。