Besplatan Rotacija i okretanje slike

Kako radi

Rotacija, okretanje, i ispravka ugla ovdje se u potpunosti odvijaju unutar vašeg preglednika koristeći HTML Canvas API — nijedna datoteka se nikada ne šalje serveru. Alat crta vašu sliku na skriveni canvas pri odabranom uglu i transformacijama skaliranja, zatim kodira rezultat u JPEG, PNG, ili WebP koristeći vlastiti kodek preglednika.

1. 1
   Slika dekodirana lokalno

   Vaša JPEG, PNG, ili WebP datoteka se učitava u HTMLImageElement putem lokalnog object URL-a — memorijske reference preglednika koja nikada ne napušta vaš uređaj. Prirodne dimenzije piksela se čitaju direktno iz dekodirane bitmape.
2. 2
   Primijenjena transformacija canvas-a

   Skriveni canvas se dimenzionira da stane u rotiranu graničnu kutiju (širina·cos + visina·sin za svaku osu). Canvas 2D kontekst se zatim pomjera u centar, rotira za odabrani ugao u radijanima, i skalira sa -1 na horizontalnoj ili vertikalnoj osi za okretanja — sve standardne ctx.rotate / ctx.scale operacije bez vanjske biblioteke.
3. 3
   Automatsko isijecanje uklanja uglove (opciono)

   Za rotacije koje nisu pod pravim uglom, ručno napisana geometrijska funkcija — largestInnerRect — izračunava najveći pravougaonik poravnat sa osama originalnog omjera stranica koji stane unutar rotirane granične kutije, tako da se trokutasti prazni uglovi uklanjaju bez izobličenja slike.
4. 4
   Kodek preglednika kodira rezultat

   canvas.toBlob() predaje podatke piksela ugrađenom enkoderu slika preglednika, proizvodeći JPEG (sa odabirljivim kvalitetom i bojom pozadine za providne uglove), PNG, ili WebP Blob koji direktno preuzimate.

Povezani alati