چرخش و برگرداندن تصویر رایگان

نحوه کار

چرخش، وارونه‌سازی، و تصحیح زاویه اینجا کاملاً درون مرورگر شما با استفاده از HTML Canvas API اجرا می‌شوند — فایلی هرگز به سروری ارسال نمی‌شود. ابزار تصویر شما را روی یک بوم خارج-از-صفحه با زاویه و تبدیل‌های مقیاس انتخابی می‌کشد، سپس نتیجه را با کدک خود مرورگر به JPEG، PNG، یا WebP کدگذاری می‌کند.

1. 1
   تصویر به‌صورت محلی رمزگشایی شد

   فایل JPEG، PNG، یا WebP شما از طریق یک URL شیء محلی — یک مرجع حافظه مرورگر که هرگز دستگاه شما را ترک نمی‌کند — در یک HTMLImageElement بارگذاری می‌شود. ابعاد پیکسل طبیعی مستقیماً از بیت‌مپ رمزگشایی‌شده خوانده می‌شوند.
2. 2
   تبدیل بوم اعمال شد

   یک بوم خارج-از-صفحه به اندازه‌ای که جعبه محدودکننده چرخانده‌شده را جا دهد اندازه‌گذاری می‌شود (width·cos + height·sin برای هر محور). زمینه Canvas 2D سپس به مرکز منتقل می‌شود، به‌اندازه زاویه انتخابی به رادیان می‌چرخد، و برای وارونه‌سازی‌ها در -۱ روی محور افقی یا عمودی مقیاس می‌شود — همه عملیات استاندارد ctx.rotate / ctx.scale بدون کتابخانه خارجی.
3. 3
   برش خودکار گوشه‌ها را می‌بُرد (اختیاری)

   برای چرخش‌های غیرقائم‌زاویه، یک تابع هندسی دست‌نویس — largestInnerRect — بزرگ‌ترین مستطیل محور-تراز از نسبت ابعاد اصلی را که داخل جعبه محدودکننده چرخانده‌شده جا می‌شود محاسبه می‌کند، پس گوشه‌های خالی مثلثی بدون تحریف تصویر حذف می‌شوند.
4. 4
   کدک مرورگر نتیجه را کدگذاری می‌کند

   canvas.toBlob() داده پیکسل را به کدگذار تصویر داخلی مرورگر تحویل می‌دهد و یک JPEG (با کیفیت انتخابی و رنگ پر پس‌زمینه برای گوشه‌های شفاف)، PNG، یا Blob مربوط به WebP تولید می‌کند که مستقیماً دانلود می‌کنید.

ابزارهای مرتبط