ຕົວປັບຮູບ ຟຣີ

ມັນເຮັດວຽກແນວໃດ

ການປັບຂະໜາດເກີດຂຶ້ນທັງໝົດພາຍໃນບຣາວເຊີຂອງທ່ານໂດຍໃຊ້ Canvas API — ເອັນຈິນສະແດງຜົນດຽວກັນທີ່ມີໃນຕົວ Chrome, Firefox, ແລະ Safari. ຮູບຂອງທ່ານຖືກແຕ້ມລົງໃນ canvas ນອກໜ້າຈໍໃນຂະໜາດໃໝ່ ແລະ ເຂົ້າລະຫັດໃໝ່ໃນເຄື່ອງ; ບໍ່ມີຫຍັງອອກຈາກອຸປະກອນຂອງທ່ານ.

1. 1
   ຮູບພາບຖືກຖອດລະຫັດໂດຍບຣາວເຊີ

   ເມື່ອທ່ານປ່ອຍ ຫຼື ເລືອກໄຟລ໌, ບຣາວເຊີຈະຖອດລະຫັດຮູບພາບ (JPEG, PNG, WebP, AVIF, ຫຼື GIF) ເປັນຂໍ້ມູນ pixel ດິບຜ່ານ HTMLImageElement. ຂະໜາດ pixel ຕົ້ນສະບັບຖືກອ່ານ ແລະ ໃຊ້ຕື່ມຊ່ອງຄວາມກວ້າງ ແລະ ຄວາມສູງລ່ວງໜ້າ.
2. 2
   Canvas ແຕ້ມໃໝ່ໃນຂະໜາດໃໝ່

   ການກົດປັບຂະໜາດຕັ້ງ HTMLCanvasElement ນອກໜ້າຈໍໃຫ້ເປັນຄວາມກວ້າງ ແລະ ຄວາມສູງທີ່ທ່ານເລືອກ, ຈາກນັ້ນເອີ້ນ ctx.drawImage() ເພື່ອຂະຫຍາຍ ແລະ ແຕ້ມທຸກ pixel ລົງໃນຂະໜາດໃໝ່. ສຳລັບຜົນລັບ JPEG, ການຕື່ມພື້ນຫຼັງສີຂາວຈະຖືກນຳໃຊ້ກ່ອນເພື່ອບໍ່ໃຫ້ພື້ນທີ່ໂປ່ງໃສກາຍເປັນສີດຳ.
3. 3
   canvas.toBlob() ເຂົ້າລະຫັດຜົນລັບ

   ຟັງຊັນ canvas.toBlob() ທີ່ມີໃນຕົວບຣາວເຊີເຂົ້າລະຫັດຂໍ້ມູນ pixel ເປັນ JPEG, PNG, ຫຼື WebP ໃນລະດັບຄຸນນະພາບທີ່ທ່ານຕັ້ງ. ຖ້າທ່ານລະບຸຂະໜາດໄຟລ໌ເປົ້າໝາຍ, ການຄົ້ນຫາແບບ binary 7 ຮອບຈະປັບພາລາມິເຕີຄຸນນະພາບໂດຍອັດຕະໂນມັດຈົນຜົນລັບພໍດີ ຫຼື ຕ່ຳກວ່າຂະໜາດນັ້ນ.
4. 4
   ຜົນລັບຖືກສະແດງຕົວຢ່າງ ແລະ ດາວໂຫຼດໃນເຄື່ອງ

   Blob ທີ່ເຂົ້າລະຫັດແລ້ວຖືກປ່ຽນເປັນ object URL ສຳລັບແຜງຕົວຢ່າງ — ບໍ່ມີການໄປມາກັບເຊີບເວີ. ການກົດດາວໂຫຼດຈະກະຕຸ້ນການບັນທຶກໃນເຄື່ອງດ້ວຍຊື່ໄຟລ໌ທີ່ລວມຂະໜາດ pixel ສຸດທ້າຍ.

ເຄື່ອງມືທີ່ກ່ຽວຂ້ອງ