SVG teisendamine PNG-ks / JPG-ks — tasuta, ilma üleslaadimiseta

Muuda SVG vektorfailid PNG- või JPG-piltideks mistahes vajaliku eraldusvõimega. Sobib ideaalselt platvormidele, mis SVG-üleslaadimisi ei aktsepteeri — kontoridokumendid, sotsiaalmeedia, e-posti allkirjad, trükitööd. Renderdamine toimub kohapeal sinu brauseris — sinu failid jäävad su seadmesse.

Mis see tööriist on?

SVG on vektorformaat — matemaatiliselt kirjeldatud kujundid, lõpmatult skaleeritavad, ideaalsed logode ja ikoonide jaoks. Kuid paljud kohad seda ei aktsepteeri: Wordi dokumendid, enamik sotsiaalmeediaplatvorme, e-posti kliendid ja lugematud üleslaadimisvormid tahavad piksleid. Teisendamine (rasterdamine) renderdab vektori kindla suurusega PNG-ks või JPG-ks.

Kuna vektoritel puudub fikseeritud eraldusvõime, valid ise väljundlaiuse — ja kuna algallikas on matemaatika, on 2048-pikslise ekspordi teravus täpselt sama, mis 256-pikslisel. PNG väljund säilitab SVG läbipaistva tausta; JPG täidab selle valgega.

Miks seda kasutada?

Iga eraldusvõime ühest allikast: 256-pikslisest lemmikikoonist kuni 2048-pikslise trükiväljundini, kõik pikslitäpselt.
PNG väljund säilitab läbipaistvuse — logod sobivad mistahes taustale.
Lahendab "SVG-d ei toetata" üleslaadimisvead sekunditega.
Pakktöötlus, kohalik töötlus, ilma üleslaadimiseta.
Käsitleb ilma otsese laiuse/kõrguseta SVG-sid, lugedes nende viewBox-i.

Kuidas kasutada

Lohista .svg failid kasti või klõpsa valimiseks.
Vali väljundlaius — Auto kasutab SVG enda deklareeritud suurust.
Vali PNG (säilitab läbipaistvuse) või JPG (valge taust).
Laadi alla iga renderdatud pilt; mõõtmed on näha iga faili juures.

Näide

Sisend

logo.svg — 4 KB vektor

Tulemus

logo.png — 1024×1024, läbipaistev taust, iga piksli juures terav

Üks väike vektorallikas annab pikslitäpseid raster-pilte mistahes soovitud suuruses.

Levinud kasutusjuhud

Ettevõtte logo (tavaliselt kujundajalt SVG-na saadud) lisamine Wordi või PowerPointi dokumenti, mis SVG manustamist ei toeta.
Rakenduse ikoonide või lemmikikoonide loomine igas nõutud piksliformaadis (16, 32, 180, 512px) ühest põhi-SVG-st.
Ikooni lisamine e-posti allkirjale, kuna enamik e-posti kliente kuvab ainult raster-pilte.
Kunstiteose üleslaadimine sotsiaalmeediaplatvormile või CMS-i, mis lükkab SVG-failid turvakaalutlustel tagasi.

Miks SVG üleslaadimispiirangud üldse olemas on

Paljud platvormid blokeerivad SVG üleslaadimised konkreetselt turvakaalutlustel, mitte kogemata: kuna SVG põhineb XML-il ja võib tehniliselt manustada JavaScripti, võib pahatahtlik SVG olla skriptide sisestamise vahend, kui platvorm renderdab seda puhastamata kujul. SVG rasterdamine PNG-ks või JPG-ks eemaldab kõik peale pikslandmete, mistõttu on see teisendus tihti nõutav, mitte lihtsalt mugav — sihtplatvorm ei saa vektorformaati turvaliselt vastu võtta, sõltumata sellest, kas sinu konkreetne SVG on kahjutu.

Kuidas eraldusvõimest sõltumatus tegelikult toimib

SVG fail ei salvesta piksleid üldse — see salvestab matemaatilisi tee-definitsioone ("tõmba joon sellest punktist sinna punkti", "täida see kõverjoon selle värviga") ja viewBox-i, mis määrab nende teede koordinaatruumi. Rasterdamisel arvutab brauseri renderdusmootor iga kõvera ja täite ümber igal soovitud pikslimõõtmel, iga kord nullist. See erineb põhimõtteliselt olemasoleva rasterpildi (JPG või PNG) suuruse muutmisest, kus suurendamine tähendab olematute pikslite väljamõtlemist ning tulemus näeb paratamatult hägune välja — 4000-pikslisena renderdatud SVG on täpselt sama terav kui 100-pikslisena renderdatud, sest mõlemad arvutatakse värskelt samast täpsest matemaatikast, mitte ei venitata väiksemast allikast.

Korduma kippuvad küsimused

Millise eraldusvõimega peaksin eksportima?

Sobita suurimaks kuvatavaks suuruseks ja natuke veel: 512px katab enamiku veebilogode kasutust, 1024px+ retina-ekraanide ja esitluste jaoks, 2048px trüki jaoks. Erinevalt foto suurendamisest ei maksa SVG-st suure väljundi tegemine teravuses midagi.

Miks mu SVG renderdub tühjana või katkisena?

Tavaliselt on põhjuseks välised viited: SVG-d, mis lingivad väliseid pilte, fonte või CSS-i, ei saa neid brauseri turvasandboxis laadida. Sisemise (inline) sisuga SVG-d teisenduvad probleemideta. Ka tekst võib nihkuda, kui see kasutab fonti, mida sinu süsteemis pole.

Kas valida PNG või JPG väljund?

Peaaegu alati PNG: logod ja ikoonid vajavad läbipaistvust ja teravaid servi, mida PNG säilitab ja JPG rikub. Vali JPG ainult siis, kui sihtkoht seda rangelt nõuab või kui SVG on foto-taoline illustratsioon.

Kas saan siin PNG-st tagasi SVG-ks teisendada?

Ei — see on põhimõtteliselt teistsugune ülesanne (pikslite kujunditeks jäljendamine), mis annab parimal juhul ligikaudseid tulemusi. See tööriist teeb vektor → raster teisendust, mis on täpne.

Kas mu SVG laaditakse teisendamiseks üles?

Ei. Brauser renderdab SVG kohalikule canvas-elemendile ja kodeerib PNG/JPG faili sinu seadmes. Midagi ei edastata.

Kas peaksin oma SVG eksportima PNG-na või JPG-na?

Kui pildil on läbipaistvus — logo, mis peab sobima mistahes taustaga — vali PNG: JPG-l pole alfakanalit ja see täidab läbipaistvad alad ühtlase värviga. PNG sobib paremini ka teravaservalisele grafikale nagu ikoonid ja diagrammid. Vali JPG ainult siis, kui SVG sisaldab fotograafilist või rohkelt üleminekutega sisu ja failisuurus on servadest olulisem.

Teisenda SVG PNG-ks või JPG-ks veebis