Nemokamas konverteris

SVG į PNG Konverteris

Konvertuokite vektorinius SVG failus į aukštos kokybės rastrinius PNG vaizdus. Naršyklėje lengvai tinkinkite išvesties skalę ir fono spalvą.

Nuvilkite SVG čia

Palaiko iki 50 MB

Arba

Apie šį įrankį

SVG (Scalable Vector Graphics) vaizdus apibūdina kaip geometrinių primityvų – kelių, formų, teksto, gradientų – rinkinį, kuris keičiasi iki bet kokio dydžio neprarandant kokybės. PNG išsaugo vieną stačiakampį pikselių tinklelį fiksuota skiriamąja geba. SVG konvertavimas į PNG yra rastrizacijos žingsnis: SVG piešimo instrukcijos įvertinamos pasirinktu pikselių dydžiu, o gauta taškinė schema užkoduojama kaip PNG. Nurodyto dydžio išvestis atrodo aiški, tačiau padidinus mastelį, išvestis padidėja.

Šis keitiklis pateikia SVG, naudodamas naršyklėje integruotą SVG variklį. SVG įkeliamas į vaizdo elementą, nubrėžiamas ant HTML5 drobės pasirinktais išvesties matmenimis ir eksportuojamas kaip PNG per canvas.toBlob. Kadangi naršyklė atlieka rastravimą, sudėtingos SVG funkcijos – gradientai, filtrai, kaukės, animacijos kaip statinis rėmelis – pateikiamos taip pat, kaip tikrame tinklalapyje.

Svarbiausias sprendimas konvertuojant SVG į PNG yra tikslinis dydis. SVG nepriklauso nuo skiriamosios gebos, todėl pasirinkus PNG dydį, atitinkantį faktinį naudojimą, išvengiama perteklinio aprūpinimo (didžiulių failų, skirtų miniatiūrų dydžio piktogramoms) ir nepakankamo aprūpinimo (neryškios išvesties, kai vėliau padidinsite mastelį). Įprasti tikslai: 32 × 32 arba 64 × 64 piktogramoms, 256 × 256 arba 512 × 512 logotipams, 1024 × 1024 herojų grafikai, 2048 × 2048 tinklainės kokybės turtui.

Kodėl konvertuoti SVG į PNG

SVG yra puikus žiniatinkliui ir šiuolaikiniams projektavimo įrankiams, tačiau baisus daugeliui kitų kontekstų. El. pašto programos SVG pateikia nenuosekliai; kai kurie blokuoja tai kaip saugumo riziką. Senesnė biuro programinė įranga, tam tikros TVS, trečiųjų šalių paslaugos ir beveik visi nuotraukų spausdinimo vamzdynai iš viso nepriima SVG. Konvertuojant į PNG, gaunamas visuotinai priimtas rastras, kuris pasirinkto dydžio atrodo identiškai.

PNG taip pat patikimai įterpiamas į biuro dokumentus, skaidrių rinkinius ir PDF, neatsižvelgiant į gavėjo SVG atvaizdavimo priemonę. Logotipams ir grafikai, kurie turi būti nuosekliai rodomi daugelyje platformų, PNG yra saugesnis pasirinkimas – net jei prarandama skiriamosios gebos nepriklausomybė, dėl kurios SVG pirmiausia yra patrauklus.

Kaip naudoti

Pasirinkite tikslinį dydį, atvaizduokite. Naršyklė atlieka rastravimą.

  1. Įkelkite SVG failą: Vilkite SVG į įkėlimo sritį arba spustelėkite, kad naršytumėte. Palaikomi failai iki 50 MB, nors tipiniai SVG failai yra gerokai mažesni nei 1 MB. Geriausiai veikia savarankiški SVG; SVG, nurodantys išorinius vaizdus per xlink:href į nuotolinius URL, gali būti neužbaigti.
  2. Pasirinkite išvesties dydį: Numatytasis yra SVG vietiniai vaizdo laukelio matmenys, tačiau galite pakeisti bet kokį pikselių dydį. Pasirinkite dydį, atitinkantį jūsų faktinį naudojimą – venkite kurti 4K PNG piktogramoms, kurios bus rodomos 32 × 32.
  3. Pateikti: Naršyklė analizuoja SVG, nupiešia jį ant drobės norimais matmenimis ir eksportuoja drobę kaip PNG. Sudėtingi SVG failai su filtrais arba dideliais kelių skaičiais gali užtrukti; paprastos piktogramos atvaizduojamos akimirksniu.
  4. Atsisiųskite PNG: Išsaugokite failą. SVG skaidrumas (viskas už nubrėžtų formų) išsaugomas kaip alfa kanalas PNG.

Įprasto naudojimo atvejai

Techninės detalės

SVG (W3C rekomendacija) yra XML pagrindu sukurtas vektorinis formatas su takų, pagrindinių formų (tiesiosios, apskritimo, elipsės, linijos, daugiakampio, polilinijos), teksto, gradientų (linijinio gradiento, radialinio gradiento), filtrų, kaukių ir klipų kelių elementais. Naršyklė analizuoja XML, sukuria DOM, taiko CSS ir rastrizuoja rezultatą puslapio pateikimo metu.

Šis keitiklis įkelia SVG į HTMLImageElement (kuris suaktyvina įprastą naršyklės SVG kaip paveikslėlio atvaizdavimo kelią), tada atkreipia jį į drobę per „drawImage“. Drobė eksportuojama kaip PNG naudojant canvas.toBlob('image/png'). Tikslūs išvesties pikseliai atitinka tai, ką SVG pateikia tokio paties dydžio naršyklės skirtuke.

Kraštiniai atvejai: SVG naudojant užsienio objektą ne visada palaikomas naudojant vaizdo elementą. SVG, nurodantis išorinius išteklius (xlink:href į kitą domeną), gali nepavykti įkelti dėl CORS. SMIL animacijos ir JavaScript pagrįstos animacijos pateikiamos tik kaip pradinis kadras.

Geriausia praktika

Dažnai užduodami klausimai

Ar mano SVG praras kokybę konvertavus į PNG?
Konvertavimas iš vektorių į rastrį reiškia, kad vaizdas tampa pikselių pagrindu ir nebegali keisti mastelio be galo. Pasirinkite didelę skiriamąją gebą, kad užtikrintumėte, jog PNG atrodytų ryškus, kai yra numatytas ekrano dydis.
Kam naudojamas PNG formatas?
PNG (Portable Network Graphics) pirmiausia naudojamas grafikai su skaidrumu, ekrano kopijomis, logotipais, piktogramomis.
Ar yra kokių nors apribojimų, kuriuos reikia žinoti?
Palaikomi failai iki 50 MB. Labai didelių ar sudėtingų failų apdorojimas gali užtrukti ilgiau. Visa konversija vyksta jūsų naršyklėje, todėl apdorojimo greitis priklauso nuo jūsų įrenginio.
Ar konvertuojant mano vaizdai yra privatūs?
Taip. Jūsų SVG failai visiškai apdorojami jūsų naršyklėje naudojant „Canvas“ API ir „JavaScript“. Niekas neįkeliamas į jokį serverį – failas patenka tiesiai iš jūsų įrenginio į keitiklį ir atgal į jūsų įrenginį.
Ar tekstas pateikiamas kaip tekstas ar kaip keliai?
Tekstas rastruojamas kaip pikseliai išvesties PNG. Išvesties nebegalima ieškoti ar pasirinkti. Jei jūsų SVG naudoja šriftus, kurių naršyklėje nėra, tekstas gali būti pateikiamas atsarginiu šriftu; konvertuoti tekstą į kelius SVG prieš pateikiant, kad būtų užtikrinta išvaizda.
Ar mano SVG įkeltas į serverį?
Ne. SVG analizė ir atvaizdavimas vyksta jūsų naršyklėje; PNG kodavimas vyksta jūsų naršyklėje. Failas nepalieka jūsų įrenginio.
Kodėl mano konvertuotas PNG tuščias?
Dažnos priežastys: SVG nurodo išorinius vaizdus, kurių nepavyko įkelti dėl CORS; SVG naudoja funkcijas, kurių nepalaiko vaizdo elemento atvaizdavimo kelias (svetimas objektas, tam tikri filtrai); SVG turi nulinio matmens peržiūros laukelį. Atidarykite SVG tiesiogiai naršyklėje, kad įsitikintumėte, jog jis pateikiamas prieš konvertuodami.
Ar galiu scenarijuje konvertuoti SVG į PNG?
Taip – paketinių užduočių atveju Node.js sąranka, naudojanti ryškų ar lėlinį vaizdą, SVG į PNG pateikia panašiai kaip naršyklėje. Šis įrankis skirtas vienkartinėms konversijoms naršyklėje nieko neįdiegiant.