CAD-rajz SVG-exportja (.svg)
W3C SzabványA Scalable Vector Graphics (SVG) egy XML-alapú vektorképes formátum kétdimenziós grafikákhoz, amely támogatja az interaktivitást, a CSS-stílusokat és az animációt.
SVG konvertálása erre: PNG
Ingyenes, böngészőben használható SVG-konverter PNG formátumba. A fájlokat azonnal konvertálhatja az eszközén.
SVG tömörítése online
Privát - a fájlok soha nem hagyják el az eszközét
Vizsgálat és metaadatok
Az operációs rendszerek és a fájlelemzők a kezdő bináris bájtsorozat vizsgálatával azonosítják a(z) SVG fájlokat:
Bájtszintű fejlécaláírás (fájlazonosító bájtok)
Az operációs rendszerek és a fájlelemzők a kezdő bináris bájtsorozat vizsgálatával azonosítják a(z) SVG fájlokat:
HEX ALÁÍRÁS (ELTOLÁS 0):
3C 73 76 67ASCII ÁBRÁZOLÁS: <svg
Szabványosítás: W3C Recommendation (SVG 1.1 / SVG 2)
Műszaki specifikációk
| Konténer architektúra | XML-alapú szöveges jelölőnyelvi dokumentum, amely 2D-s vektorgeometriát határoz meg |
| Tömörítés | Gzip / Brotli szövegtömörítés (az SVGZ gzip-tömörítést használ) |
| Bájtsorrend | Nem alkalmazható (szöveges UTF-8 / UTF-16 karakterfolyam) |
| Színterek | sRGB, CSS Color Module 4 (Display P3, lab, lch) |
| Csatornák és struktúra | Korlátlan felbontású vektoralakzatok, Bézier-görbék, tipográfia és átlátszósági maszkok |
| Max. méretek | Felbontásfüggetlen (bármilyen nézetablakra korlátlanul, pixelesedés nélkül skálázódik) |
| Átlátszóság | Teljes mértékben változtatható alfa-átlátszóság és CSS-keverési módok |
| Streaming és progresszív | A böngésző XML-elemzője által támogatott progresszív szöveges adatfolyam-elemzés |
Műszaki összehasonlító mátrix: SVG vs. versenytársak
| Technikai attribútum | SVG (Jelenlegi) | HTML5 Canvas | PNG | |
|---|---|---|---|---|
| Renderelési modell | Megtartott módú vektoros DOM | Azonnali módú bittérképes vászon | Megtartott módú rögzített oldaltároló | Raszteres pixelrács |
| Stílusok és CSS | Teljes mértékben stílusozható CSS-osztályokon és változókon keresztül | A JavaScript canvas API újbóli kirajzolását igényli | Nincs dinamikus CSS-stílusozás | Rögzített raszterpixelek |
| Korlátlan méretezhetőség | Igen (matematikai vektorgörbék) | Manuális felbontásskálázást igényel | Igen (vektorelemek) | Nem (nagyításkor pixelesedik) |
| Interaktivitás | Natív DOM-események (rámutatás, kattintás, animációk) | Manuális matematikai találatérzékelést igényel | Statikus dokumentum | Képtérképet (image map) vagy vásznat igényel |
Gyakori sérülési módok és hexadecimális helyreállítási útmutató
A böngésző XML-elemzési hibát jelez: lezáratlan token vagy nem egyező címke.
Kiváltó ok: Helytelen XML-szintaxis, hiányzó zárócímkék vagy nem escape-elt ampersandjelek ('&' az '&' helyett).
Helyreállítás: Ellenőrizze a fájl érvényességét egy XML-ellenőrzővel (xmllint file.svg), és javítsa ki a hibásan párosított címkéket.
Biztonsági elemzés és elemző (parser) támadási vektorok
Mivel az SVG futtatható XML, amely támogatja a '<script>' címkéket és a külső entitásokat, nem megbízható SVG-k megjelenítésekor jelentős XSS- és SSRF-kockázatot jelent.
Ismert támadási vektorok
- Tárolt webhelyek közötti parancsfecskendezés (Stored XSS) beágyazott '<script>' címkéken vagy 'onload=' eseménykezelőkön keresztül.
- XML-külsőentitás- (XXE-) támadások, amelyek helyi szerverfájlokat olvasnak be, amikor a fájlokat a háttérkiszolgálókon dolgozzák fel.
- A „Milliárd nevetés” (Billion Laughs) nevű XML-entitásbővítési támadás szolgáltatásmegtagadást (DoS) okoz.
Ajánlott védekezési módszerek: Mindig tisztítsa meg az SVG-ket a DOMPurify használatával beágyazás előtt, vagy szolgálja ki az SVG-ket 'Content-Security-Policy: default-src 'none'' fejléccel vagy '<img>' címkéként, amelyek automatikusan letiltják a parancsfájlokat.
Történeti háttér és mérföldkövek
Főbb előnyök
- Végtelen felbontásfüggetlenség: éles vonalak és tipográfia bármilyen kijelzőn vagy nyomtatási méretben.
- Rendkívül kis fájlméret logókhoz, ikonokhoz és felületelemekhez.
- A böngésző DOM-ján belül CSS-sel és JavaScripttel teljes mértékben vezérelhető és formázható.
Technikai korlátok és hátrányok
- Nem alkalmas fényképekhez vagy összetett, folytonos tónusú képekhez.
- A több ezer csomópontot tartalmazó összetett vektorútvonalak lassíthatják a CPU-alapú megjelenítést és gyorsabban meríthetik az akkumulátort.
- Az XML-jelleg miatt beágyazott parancsfájlokat tartalmazhat, ami szigorú tisztítást (szűrést) igényel a nem megbízható feltöltések megjelenítése előtt.
Érdekes technikai tudnivalók
- A Gzip-tömörítés egyes SVG-fájlok méretét jelentősen csökkentheti; a csökkenés a dokumentum tartalmától és a tömörítési beállításoktól függ.
- A viewBox attribútum egy absztrakt koordinátavásznat határoz meg, amely dinamikusan képeződik le a fizikai képernyőpixerekre.
- A korai webböngészőkből kezdetben hiányoztak a natív SVG-motorok, ami arra késztette az Adobét, hogy terjessze az Adobe SVG Viewer böngészőbővítményt, amíg a natív böngészőtámogatás 2011 körül megszilárdult.
Gyakran Ismételt Műszaki Kérdések
Tartalmazhatnak az SVG-fájlok kártékony kódot?
Igen. Mivel az SVG érvényes XML, tartalmazhat beágyazott JavaScriptet ('<script>'), amely akkor hajtódik végre, ha az SVG-t közvetlenül betöltik egy böngészőbe, vagy megnyitják egy beágyazott '<svg>' elemben. Az SVG-k '<img>' címkén keresztüli kiszolgálása automatikusan semlegesíti a parancsfájl futtatását.
Mikor érdemes SVG-t használni PNG helyett?
Használjon SVG-t ikonokhoz, logókhoz, diagramokhoz, illusztrációkhoz és tipográfiához, ha minden képernyőméreten éles méretezésre és kis fájlméretre van szükség. Fényképekhez használjon PNG-t vagy WebP-t.
Hogyan optimalizálhatom a nagy vagy összetett SVG-fájlokat?
A vektorútvonalakat az SVGO-hoz hasonló eszközökkel vagy SVG-tömörítéssel tisztíthatja meg a felesleges metaadatok, szerkesztői megjegyzések (Inkscape vagy Illustrator), láthatatlan csoportok és nem használt névtérdeklarációk eltávolításával.
Kapcsolódó SVG konverziós párok
Az SVG vektorfájlok PNG raszterképpé alakítása a méretezhető, kódalapú grafikát rögzített képpontráccsá alakítja a széles körű alkalmazáskompatibilitás érdekében.
Raszteres PNG-képek beágyazása SVG XML-vektorkonténerbe, hogy a weben rugalmasan méretezhetők legyenek, és vektorgrafikát támogató elrendezésekbe illeszthetők legyenek.
Fordítsa le a régebbi 16 bites Windows GDI vektoros rajzrekordokat modern, skálázható SVG útvonalakká felbontásveszteség nélkül.
Konvertálja a 32 bites Windows Enhanced Metafile grafikákat tiszta, reszponzív SVG vektorokká webes és tervezőszoftverek számára.
A DXF-rajz CAD SVG-exportformátumba alakítása az összetett mérnöki vektoradatokat kis méretű XML-grafikákká alakítja a webböngészők és vektorszerkesztők számára.
A méretezhető vektorgrafika (SVG) rajzcsere-formátumba (DXF) alakítása a webre kész vektorgrafikát a számítógépes tervezőszoftverek által megkövetelt pontos matematikai koordinátákká alakítja.
Osszon meg egy SVG-logót vagy illusztrációt egyoldalas PDF-ként. A méretezhető útvonalak rögzített felbontású képpé válnak, így nagyításkor nem nyerhető vissza a vektoros részletesség.