免費圖片旋轉與翻轉工具

工作原理

這裡的旋轉、翻轉和角度校正完全在你的瀏覽器中使用 HTML Canvas API 執行——檔案絕不會傳送到伺服器。工具按所選角度和縮放變換將圖片繪製到離屏畫布上，然後使用瀏覽器自帶的編解碼器將結果編碼為 JPEG、PNG 或 WebP。

1. 1
   在本地解碼圖片

   你的 JPEG、PNG 或 WebP 檔案透過本地物件 URL 載入到 HTMLImageElement 中——這是一個絕不會離開裝置的瀏覽器記憶體引用。原始畫素尺寸直接從解碼後的點陣圖中讀取。
2. 2
   應用畫布變換

   離屏畫布的尺寸設為能容納旋轉後的邊界框（每個軸為 width·cos + height·sin）。然後將 Canvas 2D 上下文平移到中心，按所選角度（弧度）旋轉，翻轉時在水平或垂直軸上縮放 -1——全部是標準的 ctx.rotate / ctx.scale 操作，不使用外部庫。
3. 3
   自動裁剪邊角（可選）

   對於非直角旋轉，手寫的幾何函式 largestInnerRect 會計算在旋轉後邊界框內能容納的、保持原始寬高比的最大軸對齊矩形，從而去除三角形的空白邊角而不使圖片變形。
4. 4
   瀏覽器編解碼器編碼結果

   canvas.toBlob() 將畫素資料交給瀏覽器內建的圖片編碼器，產生 JPEG（可選擇品質以及透明邊角的背景填充色）、PNG 或 WebP Blob，供你直接下載。

相關工具