Я изучаю технологии веб-приложений и столкнулся с небольшой проблемой. Я создал холст с фоновым изображением и другим изображением поверх этого фона:
// first clear the canvas
main_ctx.clearRect(0,0,canvas.width, canvas.height);
// draw the background image
main_ctx.drawImage(bg_canvas, panoramaX,panoramaY, bg_canvas.width, bg_canvas.width);
// do the transforms
main_ctx.translate(imageX+img_canvas.width/2,imageY+img_canvas.height/2);
main_ctx.rotate(angle);
main_ctx.translate(-(imageX+img_canvas.width/2),-(imageY+img_canvas.height/2));
// draw the img with the transforms applied
main_ctx.drawImage(img_canvas, imageX, imageY);
// reset the transforms
main_ctx.setTransform(1,0,0,1,0,0);
FIDDLE с созданным холстом.
Но я не могу исказить форму img_canvas (изображение сверху). Загруженное изображение, как обычно, представляет собой прямоугольник, и я хочу, чтобы оно было с закругленным нижним краем для примера..
Вот пример того, как оно должно выглядеть в конце:
Есть ли решение?
