แปลง SVG เป็น PNG
แปลงกราฟิก SVG ที่ปรับขนาดได้เป็นภาพแรสเตอร์ PNG แบบพิกเซลคงที่ เพื่อให้ใช้งานร่วมกับแอปพลิเคชันต่าง ๆ ได้
การเปรียบเทียบรูปแบบและข้อกำหนดทางเทคนิค
| ข้อกำหนด | SVG | PNG |
|---|---|---|
| ประเภท MIME | image/ | image/ |
| ประเภท | เวกเตอร์ | แรสเตอร์ |
| การบีบอัด | ข้อความ XML แบบไม่สูญเสียข้อมูล (บีบอัดด้วย GZIP ผ่าน .svgz) | ไม่สูญเสียคุณภาพ (DEFLATE / LZ77 + Huffman) |
| ข้อกำหนดมาตรฐาน | ข้อกำหนด W3C SVG 2 | ข้อกำหนด W3C PNG ฉบับที่ 3 |
| ส่วนหัวที่ระบุลายเซ็นไฟล์ | 3C 3F 78 6D 6C (<?xml) or 3C 73 76 67 (<svg) | 89 50 4E 47 0D 0A 1A 0A |
ภาพรวมรูปแบบและการใช้งาน
กราฟิกเวกเตอร์ที่ปรับขนาดได้ อาศัยโค้ดข้อความ XML เพื่อวาดเส้นทางเรขาคณิต เส้น และรูปทรงต่างๆ บนหน้าจอโดยตรง รูปแบบนี้ทำงานได้ดีเยี่ยมสำหรับโลโก้เว็บและไอคอน เนื่องจากภาพจะคมชัดที่ทุกขนาดหน้าจอ อย่างไรก็ตาม ซอฟต์แวร์รุ่นเก่าบางตัว โปรแกรมรับส่งอีเมลที่เข้มงวด และเครื่องมือพิมพ์เฉพาะทางไม่สามารถอ่านโค้ดเวกเตอร์ได้ การเปลี่ยนไฟล์ให้เป็นไฟล์ Portable Network Graphics จะช่วยแก้ปัญหานี้ได้ด้วยการวาดรูปทรงเวกเตอร์ลงในตารางพิกเซลสีที่มีขนาดคงที่ นักพัฒนาเว็บและนักออกแบบกราฟิกมักต้องการการแปลงนี้เมื่อเตรียมไอคอนสำหรับร้านค้าแอปพลิเคชันมือถือหรือแพลตฟอร์มรุ่นเก่า ร้านค้าแอปพลิเคชันกำหนดให้ต้องมีขนาดแรสเตอร์ที่เฉพาะเจาะจงสำหรับไอคอนแอปพลิเคชัน การเปลี่ยนแหล่งที่มาของเวกเตอร์ให้เป็นตารางภาพคงที่ช่วยให้มั่นใจได้ว่ากราฟิกจะแสดงผลได้อย่างถูกต้องบนทุกอุปกรณ์ โดยไม่ต้องอาศัยแอปพลิเคชันเป้าหมายในการวิเคราะห์โค้ด XML
ข้อกำหนดทางเทคนิคและรายละเอียดตัวแปลงสัญญาณ
ไฟล์ SVG ใช้ MIME type image/svg+xml และประกอบด้วยแท็ก XML แบบข้อความล้วนที่อยู่ภายในเครื่องหมายมาร์กอัป เนื่องจากเป็นเอกสารข้อความที่มนุษย์อ่านได้ จึงไม่มีลายเซ็นไบต์ ไฟล์ PNG ใช้ MIME type image/png และเริ่มด้วยลายเซ็นไบต์ 8 ไบต์ 89 50 4E 47 0D 0A 1A 0A ในเชิงโครงสร้าง SVG ใช้คำสั่งเส้นทางและพิกัดทางคณิตศาสตร์ ส่วน PNG ใช้ตารางพิกเซลแรสเตอร์ที่บีบอัดด้วยอัลกอริทึม DEFLATE ซึ่งผสานการจับคู่พจนานุกรมแบบหน้าต่างเลื่อน LZ77 กับการเข้ารหัส Huffman เพื่อบีบอัดแบบไม่สูญเสียข้อมูล
ความเข้ากันได้ของระบบปฏิบัติการและเบราว์เซอร์
ไฟล์ SVG เปิดได้ในเบราว์เซอร์สมัยใหม่ส่วนใหญ่ แต่ซอฟต์แวร์เดสก์ท็อปรุ่นเก่าอาจไม่รองรับ ส่วนภาพ PNG รองรับอย่างแพร่หลายในระบบปฏิบัติการ เบราว์เซอร์ และแอปภาพ
เคล็ดลับการใช้งาน
ตัวแปลงนี้แสดงผล SVG ตามความกว้างและความสูงที่กำหนดไว้ในไฟล์ ดังนั้นหากต้องการ PNG ที่ใหญ่ขึ้นหรือคมชัดระดับ Retina ให้กำหนดค่าความกว้างและความสูงใน SVG ให้มากขึ้นก่อนแปลง
คำถามที่พบบ่อย
มีอะไรเปลี่ยนไปเมื่อแปลงเวกเตอร์ SVG เป็นภาพ PNG แบบแรสเตอร์?
SVG เป็นเวกเตอร์ ส่วน PNG เป็นภาพแรสเตอร์ การแปลงจะแสดง SVG ตามขนาดพิกเซลที่เลือก PNG เก็บพิกเซลเหล่านั้นไว้ แต่ไม่ได้เก็บงานเวกเตอร์ต้นฉบับ
ความแตกต่างระหว่างเวกเตอร์ SVG และภาพ PNG คืออะไร
SVG เป็นรูปแบบเวกเตอร์ที่สร้างจากคำสั่งข้อความ XML ซึ่งปรับขนาดได้ไม่มีที่สิ้นสุดโดยไม่เกิดพิกเซลแตก PNG เป็นรูปแบบแรสเตอร์ที่สร้างจากตารางคงที่ของพิกเซลสีแต่ละพิกเซล เวกเตอร์จัดการการปรับขนาดและการออกแบบเว็บที่ตอบสนองต่อหน้าจอได้ดีที่สุด ในขณะที่แรสเตอร์จัดการพื้นผิวภาพถ่ายที่ซับซ้อนและใช้ร่วมกับซอฟต์แวร์ได้อย่างแพร่หลายที่สุด