Как вырезать круг в элементе canvas - PullRequest
Новая
       18

Как вырезать круг в элементе canvas

0 голосов
/ 31 января 2020

Я хочу вырезать прозрачный круг из прямоугольника холста, для которого установлена ​​прозрачность rgba(0,0,0,0.7). Когда я пытаюсь обрезать круг, путь внутри фигуры становится серым. Холст над картиной. Ожидаемое поведение прилагается.

Рисунок в сером круге: example

Ожидаемый круг: expected result

My JS код: 

context.save()  
context.fillStyle = "rgba(0,0,0,0.7)"
context.fillRect(0,0, 700, 100)
context.save()
context.globalCompositeOperation= "destination-out"
context.beginPath()
context.arc(400,100, 100, 0, 2 * Math.PI, false)
context.fill()
context.restore()
...