Поворот и обрезка изображения с помощью холста

Question

У меня есть веб-приложение, которое может загружать изображения на сервер. Я хочу обрезать и повернуть изображение перед отправкой на сервер. Любой способ сделать это с помощью HTML 5 Холст

Answer 1

Да, холст html может обрезать и поворачивать изображение.

Обрезка: Используйте расширенные свойства context.drawImage.

context.drawImage(img,cropX,cropY,cropWidth,cropHeight,0,0,cropWidth,cropHeight); 

Поворот: Используйте context.rotate свойство.

// set the point of rotation (example below sets rotation point at center-image) 

context.translate(img.width/2,img.height/2); 

// do the rotation (in radians) 

context.rotate(radianAngle); 

Примечание: все преобразования (перемещение, вращение и т.д.) являются накопительными, если вы не context.save/context.restore~~V.