Kigeuzi cha Bure

SVG kwa PNG Kigeuzi

Badilisha faili za Vekta SVG ziwe picha za ubora wa juu za Raster PNG. Binafsisha kiwango cha matokeo na rangi ya usuli kwa urahisi katika kivinjari chako.

Buruta na Udondoshe SVG hapa

Inaauni hadi 50MB

Au

Kuhusu zana hii

SVG (Scalable Vector Graphics) inafafanua picha kuwa seti ya viasili vya kijiometri - njia, maumbo, maandishi, gradient - ambazo hufikia ukubwa wowote bila kupoteza ubora. PNG huhifadhi gridi ya pikseli moja ya mstatili katika msongo usiobadilika. Kubadilisha SVG hadi PNG ni hatua ya uboreshaji: maagizo ya mchoro wa SVG yanatathminiwa katika saizi ya pikseli iliyochaguliwa na matokeo yake ya bitmap husimbwa kama PNG. Matokeo yanaonekana kuwa safi kwa saizi uliyotaja lakini ni saizi ikiwa imeongezwa.

Kigeuzi hiki kinaonyesha SVG kwa kutumia injini ya SVG iliyojengewa ndani ya kivinjari. SVG inapakiwa kwenye kipengele cha Picha, kinachochorwa kwenye turubai ya HTML5 kwa vipimo vilivyochaguliwa, na kusafirishwa kama PNG kupitia canvas.toBlob. Kwa sababu kivinjari hufanya uboreshaji, vipengele changamano vya SVG - gradient, vichujio, vinyago, uhuishaji kama fremu tuli - hutoa jinsi vile ambavyo wangefanya kwenye ukurasa halisi wa wavuti.

Uamuzi muhimu zaidi katika ubadilishaji wa SVG-to-PNG ni saizi inayolengwa. SVG haitegemei azimio, kwa hivyo kuchagua saizi ya PNG inayolingana na matumizi halisi huepuka utoaji kupita kiasi (faili kubwa za ikoni za ukubwa wa kijipicha) na utoaji wa chini (utoaji wa ukungu ukiongezwa baadaye). Malengo ya kawaida: 32×32 au 64×64 kwa ikoni, 256×256 au 512×512 kwa nembo, 1024×1024 kwa picha za shujaa, 2048×2048 kwa vipengee vya ubora wa retina.

Kwa nini Badilisha SVG kuwa PNG?

SVG ni nzuri kwa wavuti na zana za kisasa za usanifu lakini ni mbaya kwa miktadha mingine mingi. Wateja wa barua pepe hutoa SVG bila kufuatana; wengine huizuia kama hatari ya usalama. Programu za zamani za ofisi, baadhi ya CMS, huduma za wahusika wengine, na takriban mabomba yote ya kuchapisha picha hayakubali SVG hata kidogo. Kubadilisha hadi PNG hutoa raster inayokubalika ulimwenguni ambayo inaonekana sawa na saizi iliyochaguliwa.

PNG pia hupachikwa kwenye hati za ofisi, staha za slaidi na PDF bila kutegemea kionyeshi cha SVG cha mpokeaji. Kwa nembo na michoro zinazohitaji kuonekana mara kwa mara kwenye mifumo mingi, PNG ndiyo chaguo salama zaidi - ingawa inapoteza uhuru wa azimio ambao hufanya SVG kuvutia hapo kwanza.

Jinsi ya kutumia

Chagua saizi unayolenga, toa. Kivinjari hufanya rasterization.

  1. Pakia faili ya SVG: Buruta SVG kwenye eneo la kupakia au ubofye ili kuvinjari. Faili za hadi MB 50 zinatumika, ingawa SVG za kawaida ziko chini ya MB 1. SVG zinazojitosheleza hufanya kazi vizuri zaidi; SVG zinazorejelea picha za nje kupitia xlink:href hadi URL za mbali zinaweza kutokamilika.
  2. Chagua ukubwa wa pato: Chaguomsingi ni vipimo asili vya Sanduku la kutazama la SVG, lakini unaweza kubatilisha hadi saizi yoyote ya pikseli. Chagua saizi inayolingana na matumizi yako halisi - epuka kutengeneza PNG za 4K kwa ikoni ambazo zitaonyeshwa kwa 32×32.
  3. Toa: Kivinjari huchanganua SVG, kuichora kwenye turubai kwa vipimo vilivyoombwa, na kusafirisha turubai kama PNG. SVG changamano zilizo na vichungi au hesabu kubwa za njia zinaweza kuchukua muda; icons rahisi kutoa mara moja.
  4. Pakua PNG: Hifadhi faili. Uwazi katika SVG (kitu chochote kilichochorwa nje ya maumbo) huhifadhiwa kama kituo cha alfa katika PNG.

Kesi za Matumizi ya Kawaida

Maelezo ya Kiufundi

SVG (Pendekezo la W3C) ni umbizo la kivekta lenye msingi wa XML na vipengele vya njia, maumbo ya msingi (rect, duara, duaradufu, mstari, poligoni, polyline), maandishi, gradient (linearGradient, radialGradient), vichujio, barakoa, na njia za klipu. Kivinjari huchanganua XML, hutengeneza DOM, hutumia CSS, na kubatilisha matokeo wakati wa kutoa ukurasa.

Kigeuzi hiki hupakia SVG kwenye HTMLImageElement (ambayo huanzisha njia ya kawaida ya uwasilishaji ya SVG-kama-picha ya kivinjari), kisha kuichora kwenye turubai kupitia drawImage. Turubai inasafirishwa kama PNG kwa kutumia canvas.toBlob('image/png'). Pikseli halisi katika towe zinalingana na kile ambacho SVG ingetoa kwa ukubwa sawa katika kichupo cha kivinjari.

Kesi za ukingo: SVG kwa kutumia foreignObject haitumiki kila wakati inapotumiwa kupitia kipengele cha Picha. SVG inayorejelea rasilimali za nje (xlink:href kwa kikoa tofauti) inaweza kushindwa kupakia kwa sababu ya CORS. Uhuishaji wa SMIL na uhuishaji unaoendeshwa na JavaScript unatoa kama fremu ya awali pekee.

Mazoea Bora

Maswali yanayoulizwa mara kwa mara

SVG yangu itapoteza ubora inapobadilishwa kuwa PNG?
Ugeuzaji wa Vekta-kwa-rasta unamaanisha kuwa picha inakuwa ya msingi wa pikseli na haiwezi tena kuzidisha ukubwa. Chagua mwonekano wa juu ili kuhakikisha kuwa PNG inaonekana kali kulingana na saizi yako ya onyesho unayokusudia.
Umbizo la PNG linatumika kwa nini?
PNG (Portable Network Graphics) hutumiwa kimsingi kwa michoro yenye uwazi, picha za skrini, nembo, aikoni.
Je, kuna mapungufu yoyote ya kufahamu?
Faili za hadi MB 50 zinaweza kutumika. Faili kubwa sana au changamano zinaweza kuchukua muda mrefu kuchakatwa. Ugeuzaji wote hufanyika kwenye kivinjari chako, kwa hivyo kasi ya kuchakata inategemea kifaa chako.
Je, picha zangu huwekwa faragha wakati wa ubadilishaji?
Ndiyo. Faili zako za SVG huchakatwa kabisa ndani ya kivinjari chako kwa kutumia Canvas API na JavaScript. Hakuna kinachopakiwa kwa seva yoyote - faili huenda moja kwa moja kutoka kwa kifaa chako hadi kwa kibadilishaji na kurudi kwenye kifaa chako.
Je, maandishi yametolewa kama maandishi au kama njia?
Maandishi yamefanywa kuwa saizi katika toleo la PNG. Matokeo hayawezi kutafutwa tena au kuchaguliwa. Ikiwa SVG yako inatumia fonti zisizopatikana kwenye kivinjari, maandishi yanaweza kutoa katika fonti mbadala; badilisha maandishi kuwa njia katika SVG kabla ya kutoa kwa mwonekano uliohakikishwa.
SVG yangu imepakiwa kwenye seva?
Hapana. uchanganuzi na uwasilishaji wa SVG hufanyika katika kivinjari chako; Usimbaji wa PNG hufanyika kwenye kivinjari chako. Faili haiachi kifaa chako.
Kwa nini PNG yangu iliyogeuzwa iko tupu?
Sababu za kawaida: SVG inarejelea picha za nje ambazo hazikuweza kupakiwa kwa sababu ya CORS; SVG hutumia vipengele visivyotumika na njia ya utoaji kipengele cha Picha (foreignObject, vichujio fulani); SVG ina kisanduku cha kutazama chenye sura sifuri. Fungua SVG moja kwa moja kwenye kivinjari ili uthibitishe kuwa inatoa kabla ya kubadilisha.
Ninaweza kubadilisha SVG kuwa PNG kwenye hati?
Ndiyo - kwa kazi za kundi, usanidi wa Node.js kwa kutumia sharp au puppeteer hutoa SVG kwa PNG kwa uaminifu sawa na kivinjari. Chombo hiki ni cha ubadilishaji wa mara moja kwenye kivinjari bila kusakinisha chochote.