now you need to pass a image object to the drawImage (img,dx,dy) method of canvas for drawing.
but the picture it draws by default has a transparent area around it and is filled with white by default.
is the image source as follows:
:
in the effect picture, the corners of the upper and lower circles are obviously filled with opaque white, thus covering the next layer of circles.
the surrounding mosaic area needs to be transparent instead of filled with white
excuse me, how can this requirement be realized?
create a new image object, and eventually draw a graph for canvas
var image = new Image();
image.src = "../img/mubiao.png";
...
var ctx = canvas.getContext("2d");
ctx.drawImage(image,dx,dy);