قص الصورة

كيف يعمل

يُحمَّل ملفك عبر URL.createObjectURL، وهو مرجع محلي في الذاكرة، وليس رفعًا أبدًا، ويُعرَض مصغَّرًا ليناسب المحرر. يُتتبَّع مربع القص الذي تسحبه بوحدات بكسل الشاشة، لكن في اللحظة التي تضغط فيها على القص، تُضرَب تلك الإحداثيات بالنسبة بين الحجم الطبيعي للصورة وحجم عرضها. لذا إذا كانت صورتك بحجم 4000 بكسل تُعرَض بعرض 800 بكسل، فإن مربعًا بعرض 200 بكسل على الشاشة يحدد منطقة بعرض 1000 بكسل من الصورة الحقيقية. يُنسَخ المستطيل المحدَّد بعدها باستخدام شكل مستطيل المصدر لدالة drawImage في واجهة canvas، والتي تسحب بالضبط تلك البكسلات من الأصل بالدقة الكاملة.

يتبع تنسيق الإخراج تنسيق الإدخال: PNG يدخل، PNG يخرج (بدون فقدان، مطابق بكسل لبكسل لمنطقة المصدر)، وأي شيء آخر يُعاد ترميزه كـ JPEG بجودة 92% عبر canvas.toBlob. هذا التمييز يستحق المعرفة: قص ملف JPEG يعني جيلًا إضافيًا من ضغط JPEG، وغالبًا غير مرئي بجودة 92% لكنه حقيقي. إذا كنت بحاجة إلى قص دقيق على مستوى البكسل، أعطِ الأداة ملف PNG.

يحدث كل ما سبق في مُفكِّك ترميز الصور وcanvas الخاص بمتصفحك. افتح لسان Network في أدوات المطوّر قبل إسقاط صورة: لا يحمل أي طلب الصورة أبدًا، وهذا يعني أيضًا عدم وجود حد لحجم من جانب الخادم ولا طابور انتظار.