ตัวแปลง GeoJSON เป็น SVG

แปลง GeoJSON เป็น SVG (Scalable Vector Graphics) สำหรับแผนที่ที่ปรับขนาดได้และแก้ไขได้ เหมาะสำหรับโลโก้ วัสดุพิมพ์ งานนำเสนอ และการใช้งานบนเว็บ

ทำไมต้อง SVG?

ปรับขนาดได้

• ปรับขนาดได้อย่างสมบูรณ์แบบ โดยไม่มีการสูญเสียคุณภาพ
• พร้อมสำหรับการพิมพ์ ในทุกความละเอียด
• จอ Retina/4K ดูสมบูรณ์แบบ
• ซูมได้ไม่จำกัด โดยไม่มีการแตกเป็นพิกเซล

แก้ไขได้

• เปิดใน Illustrator, Inkscape หรือ Figma สำหรับการแก้ไขขั้นสูง
• เปลี่ยนสี เส้นขอบ การเติม หลังการส่งออก
• เพิ่มข้อความ คำอธิบาย โลโก้ ด้วยซอฟต์แวร์ออกแบบ
• รวมกับกราฟิกอื่นๆ ได้ง่าย

เป็นมิตรกับเว็บ

• ขนาดไฟล์เล็ก สำหรับแผนที่ง่ายๆ
• การจัดสไตล์ด้วย CSS — จัดสไตล์ด้วย CSS ในหน้าเว็บ
• การเคลื่อนไหวด้วย JavaScript — เคลื่อนไหวเส้นทางและคุณสมบัติ
• ฝังใน HTML — วางลงใน HTML โดยตรง
• เข้าถึงได้ — เครื่องอ่านหน้าจอสามารถอ่านเนื้อหา SVG ได้

กรณีการใช้งาน

✅ โลโก้และการสร้างแบรนด์ — แผนที่ตำแหน่งบริษัท
✅ วัสดุพิมพ์ — โบรชัวร์ โปสเตอร์ หนังสือ
✅ กราฟิกบนเว็บ — ไอคอน ป้าย UI
✅ การแสดงข้อมูล — อินโฟกราฟิก แดชบอร์ด
✅ สินค้า — เสื้อยืด สติ๊กเกอร์ แก้วน้ำ
✅ งานนำเสนอ — สไลด์ที่ปรับขนาดได้อย่างสวยงาม

วิธีการแปลง

1. อัปโหลด ไฟล์ GeoJSON ของคุณ (ลากและวางหรือเลือกไฟล์)
2. ดูตัวอย่าง การแสดงผลแผนที่
3. รูปแบบ ถูกตั้งค่าเป็น SVG โดยอัตโนมัติ
4. ดาวน์โหลด แผนที่เวกเตอร์ของคุณ

เครื่องมือจะสร้างโค้ด SVG ที่สะอาดและปรับแต่งได้ซึ่งใช้งานได้ทุกที่

คุณสมบัติของ SVG

สิ่งที่คุณได้รับ

• โค้ดสะอาด — โค้ด SVG ที่อ่านง่าย
• รูปแบบมาตรฐาน — เข้ากันได้กับเครื่องมือออกแบบทั้งหมด
• เส้นทางที่ปรับแต่ง — ลดขนาดไฟล์ให้เล็กลง
• viewBox ที่เหมาะสม — ปรับขนาดได้อย่างถูกต้อง
• การฉายภาพทางภูมิศาสตร์ — พลิกเพื่อให้ทิศเหนืออยู่ด้านบน

แก้ไขหลังการส่งออก

เปิด SVG ของคุณใน:

• Adobe Illustrator — เครื่องมือแก้ไขเวกเตอร์ระดับมืออาชีพ
• Inkscape — ทางเลือกฟรีและโอเพ่นซอร์ส
• Figma — เครื่องมือออกแบบบนเบราว์เซอร์
• Sketch — ซอฟต์แวร์ออกแบบสำหรับ Mac
• โปรแกรมแก้ไขข้อความใดๆ — SVG เป็นเพียง XML

ตัวเลือกการจัดสไตล์

• สีเส้นขอบ — สีของเส้นขอบสำหรับเขตแดน
• ความหนาเส้นขอบ — ความหนาของเส้น
• สีเติม — สีภายในของรูปหลายเหลี่ยม
• ความโปร่งใส — ระดับความโปร่งใส
• พื้นหลัง — โปร่งใสหรือมีสี

กรณีการใช้งานทั่วไป

การออกแบบและการสร้างแบรนด์

• แผนที่ตำแหน่งบริษัท สำหรับเว็บไซต์
• แผนที่ครอบคลุมภูมิภาค สำหรับการตลาด
• แผนที่พื้นที่บริการ สำหรับงานนำเสนอ
• ชุดไอคอน จากรูปทรงง่ายๆ

การพิมพ์

• ภาพประกอบในหนังสือ — คู่มือการเดินทาง หนังสือเรียน
• กราฟิกในนิตยสาร — แผนที่สำหรับบทความ
• โปสเตอร์ — แผนที่สำหรับงานอีเวนต์ วัสดุสำหรับการประชุม
• นามบัตร — แผนที่ตำแหน่งบนบัตร

การพัฒนาเว็บ

• แผนที่แบบโต้ตอบ ด้วย CSS/JS
• เส้นทางที่เคลื่อนไหว — การเคลื่อนไหวแบบวาดเส้น
• กราฟิกที่ตอบสนอง — ปรับขนาดตาม viewport
• ไลบรารีไอคอน — ไอคอนแผนที่ที่ใช้ซ้ำได้

สินค้า

• การออกแบบเสื้อยืด — เส้นรอบประเทศ/รัฐ
• สติ๊กเกอร์ — รูปทรงทางภูมิศาสตร์
• แก้วน้ำและถ้วย — ผลิตภัณฑ์ที่อิงตำแหน่ง
• โปสเตอร์ — ศิลปะแผนที่แบบมินิมอล

เคล็ดลับสำหรับผลลัพธ์ที่ดีที่สุด

การปรับขนาดไฟล์

• ลดความซับซ้อนของรูปทรงเรขาคณิต ก่อนการส่งออก (ใช้ GeoJSON Minifier)
• ลบคุณสมบัติที่ไม่จำเป็น จากคุณสมบัติของ GeoJSON
• รวมรูปหลายเหลี่ยมที่อยู่ติดกัน เมื่อเป็นไปได้
• ใช้ตัวเลขที่มีความแม่นยำต่ำกว่า ในพิกัด

เคล็ดลับการออกแบบ

• ทำให้เรียบง่าย — SVG ทำงานได้ดีที่สุดสำหรับแผนที่ที่สะอาดและชัดเจน
• ใช้สีทึบ — หลีกเลี่ยงการไล่ระดับสีที่ซับซ้อน
• ทดสอบในขนาดต่างๆ — ตรวจสอบความชัดเจนเมื่อปรับขนาด
• พิจารณาสัดส่วนระหว่างเส้นขอบและการเติม — เส้นขอบหนาอาจทำให้แผนที่ขนาดเล็กดูรก

ประสิทธิภาพบนเว็บ

• ฝัง SVG ขนาดเล็ก — ฝังลงใน HTML โดยตรง
• ใช้ไฟล์ภายนอกสำหรับแผนที่ขนาดใหญ่ — ลิงก์ไปยังไฟล์ .svg
• โหลดแบบ Lazy — โหลด SVG เมื่อมองเห็นได้
• บีบอัด — ใช้ SVGO หรือเครื่องมือที่คล้ายกันสำหรับการปรับแต่ง

รายละเอียดทางเทคนิค

การฉายภาพ

• Web Mercator เป็นค่าเริ่มต้น (มาตรฐานสำหรับแผนที่เว็บ)
• แกน Y พลิกกลับ เพื่อให้ทิศเหนืออยู่ด้านบน (SVG มีแกน Y ลงเป็นค่าเริ่มต้น)
• พิกัดที่ถูกต้อง สำหรับการแสดงผลทางภูมิศาสตร์ที่แม่นยำ

โครงสร้าง SVG

<svg viewBox="minX minY width height">
  <path d="M x,y L x,y..." />
  <!-- หนึ่งเส้นทางต่อหนึ่งฟีเจอร์ -->
</svg>

ความเข้ากันได้ของเบราว์เซอร์

• ✅ เบราว์เซอร์สมัยใหม่ทั้งหมด (Chrome, Firefox, Safari, Edge)
• ✅ IE 9+ (รองรับพื้นฐาน)
• ✅ เบราว์เซอร์มือถือ (iOS Safari, Chrome)

คำถามที่พบบ่อย

ฉันสามารถแก้ไข SVG หลังการส่งออกได้หรือไม่?
ได้! เปิดไฟล์ในโปรแกรมแก้ไขเวกเตอร์ใดๆ (Illustrator, Inkscape, Figma ฯลฯ) เพื่อเปลี่ยนสี เพิ่มข้อความ หรือแก้ไขรูปทรง

SVG รองรับความโปร่งใสหรือไม่?
ใช่ SVG รองรับพื้นหลังโปร่งใสและระดับความโปร่งใสโดยธรรมชาติ

ขนาดไฟล์เป็นอย่างไร?
ไฟล์ SVG มักมีขนาดเล็ก (ไม่กี่ KB) สำหรับแผนที่ง่ายๆ แผนที่ที่ซับซ้อนที่มีฟีเจอร์มากจะมีขนาดใหญ่ขึ้น

ฉันสามารถใช้ SVG สำหรับการพิมพ์ได้หรือไม่?
แน่นอน! SVG สามารถปรับขนาดได้และเหมาะสำหรับการพิมพ์ในทุกขนาด

ฉันจะเปลี่ยนสีได้อย่างไร?
ในโปรแกรมแก้ไขข้อความ ให้ค้นหาแอตทริบิวต์ stroke และ fill และเปลี่ยนค่าของสี หรือใช้ซอฟต์แวร์ออกแบบเพื่อแก้ไขแบบภาพ

ฉันสามารถเคลื่อนไหวแผนที่ SVG ได้หรือไม่?
ได้! SVG สามารถเคลื่อนไหวด้วย CSS หรือ JavaScript เส้นทางแต่ละเส้นสามารถจัดสไตล์และเคลื่อนไหวได้อย่างอิสระ

การแปลงข้อมูลสูญเสียหรือไม่?
ไม่ ข้อมูลทางภูมิศาสตร์จะถูกเก็บรักษาไว้อย่างถูกต้อง อาจมีการลดความซับซ้อนของภาพสำหรับรูปทรงที่ซับซ้อนมาก

ดูเพิ่มเติม

• GeoJSON to PNG — ภาพแรสเตอร์พร้อมความโปร่งใส
• GeoJSON to JPEG — ภาพแรสเตอร์ที่ถูกบีบอัด
• กลับไปที่ตัวแปลงทั้งหมด