![enter image description here](https://i.stack.imgur.com/yTNkq.png)

First I am explaining the above image. Image is marking with 1, 2 and 3. 

1 - This is the rectangle shape.

2 - This is the rectangle shape.

3 - This is the circle shape (draw with destination-in global composite operation).

Every shape draw using HTML5 canvas.

Now I want to same draw using threejs with WebGLRenderer. So is it possible to draw? If yes then how?

3rd shape can be anything (for ex - circle, rectangle, polygon).

Any suggestion?