任何CSS或JavaScript技術來顯示一個圓形圖像的'切片'？

Question

我試圖寫一個程序，用戶上傳喜歡這美味的比薩餅溫暖圓形圖片：

然後，用戶在指定的弧的開始和結束，這樣的功能將被調用，以顯示相同圖像，在剩下的部分具有較低的不透明度。

function cutPizza (startArcDegree, endArcDegree){ 
//This is where I need help  
} 

cutPizza(150, 225); 

是否有任何CSS或JavaScript技術來幫助我實現這個（或任何方式或爲此事）？

Answer 1

是的，你應該有一個與你的披薩圖像有相對位置的畫布。然後，你可以請你在畫布上圈，並配置帆布透明度

瞭解如何從這裏畫圈圈：

http://billmill.org/static/canvastutorial/ball.html

Answer 2

你可以嘗試生成SVG，然後看看Clipping, Masking and Compositing