วิธีสร้างแผนที่แบบกำหนดเองโดยใช้ OpenStreetMap: 7 ขั้นตอน (พร้อมรูปภาพ)

2025 ผู้เขียน: John Day | [email protected]. แก้ไขล่าสุด: 2025-01-23 15:12

ในคำแนะนำนี้ ฉันจะอธิบายกระบวนการที่คุณสามารถสร้างแผนที่ที่ปรับแต่งเองได้ แผนที่ที่มีสไตล์เป็นแผนที่ที่ผู้ใช้สามารถระบุได้ว่าจะแสดงชั้นข้อมูลใด รวมทั้งกำหนดรูปแบบที่แต่ละชั้นจะแสดงเป็นภาพ ก่อนอื่นฉันจะอธิบายกระบวนการที่คุณสามารถเขียนซอฟต์แวร์เพื่อปรับแต่งแผนที่ ตามด้วยตัวอย่างของซอฟต์แวร์ Python ที่ฉันเขียนเพื่อทำงานนี้

วิดีโอต่อไปนี้เน้นวิธีที่ฉันสร้างแผนที่ที่มีสไตล์เป็นการส่วนตัว แต่โปรดอ่านรายละเอียดอย่างใกล้ชิด ฉันตื่นเต้นมากที่ได้เห็นสิ่งที่ชุมชนสร้างขึ้น!

อะไรคือแรงจูงใจของฉันที่อยู่เบื้องหลังโครงการนี้?

ค่อนข้างตรงไปตรงมา ฉันเริ่มโครงการนี้เพราะคิดว่ามันน่าจะสนุกที่จะทำ ความคิดนี้วนเวียนอยู่ในหัวของฉันตลอดปีที่ผ่านมา และในที่สุดฉันก็ใช้เวลาที่จำเป็นเพื่อให้มันบรรลุผล หลังจากใช้เวลาสร้างต้นแบบด้วยการเขียนสคริปต์พื้นฐานมาทั้งวัน ฉันก็สามารถสร้างผลลัพธ์ที่น่าพึงพอใจได้ ดังนั้นสัญญาด้วยว่าฉันรู้ว่าฉันต้องทำให้สคริปต์ของฉันเป็นแบบแผน เพื่อให้ผู้อื่นสามารถสร้างสรรค์ผลงานของตัวเองได้อย่างง่ายดาย

แรงจูงใจของฉันในการเขียนคำแนะนำนี้เกิดจากการที่ฉันพบข้อมูลน้อยมากเกี่ยวกับวิธีสร้างแผนที่ที่มีสไตล์ของคุณเองตั้งแต่เริ่มต้น ฉันหวังว่าจะได้แบ่งปันสิ่งที่ฉันได้เรียนรู้กับชุมชน

แหล่งข้อมูล/ลิงค์:

• OpenStreetMap
• OpenStreetMap ถูกกฎหมาย
• ที่เก็บ Github

เสบียง

• การกระจาย Python (ฉันใช้ Anaconda & Python 3.6)
• PyQt5 (สำหรับการพึ่งพา GUI)

ขั้นตอนที่ 1: กำหนดกระบวนการ I: การดาวน์โหลดไฟล์ OSM

เมื่อฉันเริ่มโครงการนี้ครั้งแรก คำถามที่เห็นได้ชัดที่สุดคือ "ฉันจะรับข้อมูลแผนที่ได้จากที่ใด" เป็นไปตามที่คุณคาดหวัง ฉันนึกถึง Google Maps ทันที หลังจากการวิจัยครั้งสำคัญ ฉันพบว่า Google ไม่ต้องการให้ผู้คนเล่นข้อมูลของตนในทางที่สร้างสรรค์หรืออย่างอื่น อันที่จริง พวกเขาไม่อนุญาตการขูดเว็บจาก Google Maps อย่างชัดเจน

โชคดีที่ฉันสิ้นหวังเมื่อค้นพบ OpenStreetMap (OSM) OSM เป็นโครงการความร่วมมือที่เกี่ยวข้องกับผู้คนทั่วโลกที่ให้ข้อมูล OSM อนุญาตการใช้ข้อมูลแบบปลายเปิดอย่างชัดเจนในชื่อซอฟต์แวร์โอเพ่นซอร์ส ดังนั้น การเยี่ยมชมหน้าเว็บ OSM จึงเป็นจุดเริ่มต้นของเส้นทางการจัดทำแผนที่

หลังจากมาถึงเว็บไซต์ OSM แล้ว ให้คลิกที่แท็บ "ส่งออก" เพื่อแสดงเครื่องมือส่งออกแผนที่ ตอนนี้ ซูมเข้าเพื่อดูภูมิภาคที่คุณสนใจที่จะรวบรวมข้อมูลแผนที่ด้วย เลือกลิงก์ "เลือกพื้นที่อื่นด้วยตนเอง" ซึ่งจะแสดงช่องบนหน้าจอของคุณ จัดรูปแบบและวางกล่องนี้ไว้เหนือพื้นที่ที่สนใจ เมื่อพอใจแล้ว ให้คลิกปุ่ม "ส่งออก" เพื่อดาวน์โหลดไฟล์ข้อมูล OSM ของคุณ

หมายเหตุ #1: หากภูมิภาคที่คุณเลือกมีข้อมูลมากเกินไป คุณจะได้รับข้อผิดพลาดว่าคุณได้เลือกโหนดมากเกินไป หากเกิดเหตุการณ์นี้กับคุณ ให้คลิกปุ่ม "Overpass API" เพื่อดาวน์โหลดไฟล์ขนาดใหญ่กว่าของคุณ

หมายเหตุ #2: หากไฟล์ OSM ที่คุณดาวน์โหลดมีขนาดใหญ่กว่า 30MB โปรแกรม Python ที่ฉันเขียนจะช้าลงอย่างเห็นได้ชัด หากคุณตั้งใจจะใช้พื้นที่ขนาดใหญ่ ให้ลองเขียนสคริปต์เพื่อทิ้งข้อมูลฟุ่มเฟือยที่คุณไม่ได้วางแผนจะวาด

ขั้นตอนที่ 2: การกำหนดกระบวนการ II: การทำความเข้าใจข้อมูล

“ฉันมีข้อมูล…แล้วไง”

เริ่มต้นด้วยการเปิดไฟล์ OSM ที่ดาวน์โหลดมาลงในซอฟต์แวร์แก้ไขข้อความที่คุณชื่นชอบ ก่อนอื่นคุณจะสังเกตเห็นว่านี่เป็นไฟล์ XML ซึ่งเยี่ยมมาก! XML นั้นง่ายพอที่จะแยกวิเคราะห์ จุดเริ่มต้นของไฟล์ควรมีลักษณะใกล้เคียงกับภาพแรกของขั้นตอนนี้ โดยจะแสดงรายการเมตาดาต้าพื้นฐานและขอบเขตทางภูมิศาสตร์

เมื่อคุณเลื่อนไฟล์ คุณจะสังเกตเห็นองค์ประกอบข้อมูลสามองค์ประกอบที่ใช้ตลอด:

1. โหนด
2. วิธี
3. ความสัมพันธ์

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

วิธีคือชุดของโหนด วิธีสามารถแสดงผลเป็นรูปร่างที่ล้อมรอบหรือเป็นเส้นปลายเปิด วิธีประกอบด้วยชุดของโหนดที่ระบุโดยตัวระบุที่ไม่ซ้ำกัน พวกเขาถูกแท็กด้วยคีย์ที่กำหนดกลุ่มข้อมูลที่พวกเขาเป็นสมาชิก ตัวอย่างเช่น วิธีในภาพที่สามด้านบนเป็นของกลุ่มข้อมูล "สถานที่ " และกลุ่มย่อย "เกาะ" กล่าวอีกนัยหนึ่ง วิธีนี้เป็นของเลเยอร์ "เกาะ" ใต้กลุ่ม "สถานที่" วิธียังมีตัวระบุที่ไม่ซ้ำกัน

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

คุณสามารถอ่านเพิ่มเติมเกี่ยวกับองค์ประกอบข้อมูลเหล่านี้ได้จากวิกิ OSM:

• โหนด
• วิธี
• ความสัมพันธ์

ขั้นตอนที่ 3: การกำหนดกระบวนการ III: การย่อยข้อมูล

ตอนนี้คุณควรมีความเข้าใจอย่างผิวเผินขององค์ประกอบข้อมูลที่ประกอบเป็นไฟล์ OSM ณ จุดนี้ เราสนใจที่จะอ่านข้อมูล OSM โดยใช้ภาษาที่คุณเลือก แม้ว่าขั้นตอนนี้จะใช้ Python เป็นศูนย์กลาง แต่ถ้าคุณไม่ต้องการใช้ Python คุณควรอ่านส่วนนี้เนื่องจากมีเคล็ดลับและลูกเล่นเล็กน้อย

แพ็คเกจ xml ถูกรวมไว้โดยค่าเริ่มต้นด้วยการแจกแจง Python มาตรฐานส่วนใหญ่ เราจะใช้แพ็คเกจนี้เพื่อแยกวิเคราะห์ไฟล์ OSM ของเราอย่างง่ายดายดังที่แสดงในภาพแรก ใน single for loop คุณสามารถประมวลผลการจัดการข้อมูล OSM สำหรับแต่ละองค์ประกอบข้อมูลเฉพาะ

ในบรรทัดสุดท้ายของรูปภาพ คุณจะสังเกตเห็นว่าฉันตรวจสอบแท็ก 'bounds' ขั้นตอนนี้มีความสำคัญอย่างยิ่งในการแปลค่าละติจูดและลองจิจูดเป็นพิกเซลบนหน้าจอ ฉันขอแนะนำให้เรียกใช้การแปลงนี้เมื่อคุณโหลดไฟล์ OSM เนื่องจากการแปลงข้อมูลจำนวนมากเป็นกระบวนการที่เข้มข้น

เมื่อพูดถึงการแปลงละติจูดและลองจิจูดเป็นพิกัดหน้าจอ นี่คือลิงค์ไปยังฟังก์ชันการคำนวณที่ฉันเขียน คุณน่าจะสังเกตเห็นสิ่งแปลก ๆ เล็กน้อยในการแปลงละติจูดเป็นพิกัดหน้าจอ มีขั้นตอนเพิ่มเติมที่เกี่ยวข้องเมื่อเทียบกับลองจิจูด! ตามที่ปรากฎ ข้อมูล OSM ถูกจำลองโดยใช้วิธีการฉายภาพหลอก-เมอร์เคเตอร์ โชคดีที่ OSM มีเอกสารที่ยอดเยี่ยมเกี่ยวกับหัวข้อนี้ที่นี่ และมีฟังก์ชันการแปลงละติจูดสำหรับภาษาจำนวนมาก สุดยอด!

หมายเหตุ: ในรหัสของฉัน พิกัดหน้าจอ (0, 0) คือมุมซ้ายบนของหน้าจอ

ขั้นตอนที่ 4: การนำ Python Map Stylizer ไปใช้

จนถึงตอนนี้ ฉันได้พูดถึงไฟล์ข้อมูล OSM แล้ว - มันคืออะไร อ่านอย่างไร และจะทำอย่างไรกับมัน ตอนนี้ฉันจะพูดถึงซอฟต์แวร์ที่ฉันเขียนเพื่อจัดการกับการแสดงภาพแผนที่โวหาร (GitHub repo ที่ให้ไว้ในบทนำ)

การใช้งานเฉพาะของฉันมุ่งเน้นไปที่การควบคุมผู้ใช้ของไปป์ไลน์การเรนเดอร์ โดยเฉพาะอย่างยิ่ง ฉันอนุญาตให้ผู้ใช้เลือกเลเยอร์ที่ต้องการให้มองเห็นได้ และต้องการให้แสดงเลเยอร์นั้นอย่างไร ดังที่ได้กล่าวไว้ก่อนหน้านี้สั้น ๆ ว่ามีการแสดงองค์ประกอบสองประเภท: รายการเติมและรายการโฆษณา การเติมถูกกำหนดโดยสีเท่านั้น ในขณะที่เส้นถูกกำหนดโดยสี ความกว้างของเส้น ลักษณะเส้น ลักษณะฝาบรรทัด และลักษณะการรวมเส้น

เมื่อผู้ใช้ทำการปรับเปลี่ยนสไตล์เลเยอร์และการมองเห็น การเปลี่ยนแปลงจะมีผลในวิดเจ็ตแผนที่ทางด้านขวา เมื่อผู้ใช้แก้ไขรูปลักษณ์ของแผนที่จนพอใจแล้ว เขาสามารถปรับขนาดแผนที่สูงสุดและบันทึกแผนที่เป็นภาพในคอมพิวเตอร์ได้ ในการบันทึกรูปภาพ ไฟล์การกำหนดค่าผู้ใช้จะถูกบันทึกด้วย เพื่อให้แน่ใจว่าผู้ใช้สามารถเรียกคืนและนำการกำหนดค่าที่เขาใช้เพื่อสร้างภาพเฉพาะได้ตลอดเวลา

ขั้นตอนที่ 5: ข้อเสียของการนำไปใช้งาน + วิธีแก้ปัญหา

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

ฉันเริ่มต้นด้วยการระบุเลเยอร์ที่ฉันสนใจเป็นพิเศษ สำหรับจุดประสงค์ของคำแนะนำนี้ สมมติว่าฉันสนใจสิ่งปลูกสร้าง (ทั้งหมด) แม่น้ำ ทางหลวงสายหลัก และถนนผิวน้ำมากที่สุด ฉันจะเขียนสคริปต์ที่ฉันสร้างอินสแตนซ์ของการกำหนดค่า สลับสถานะเลเยอร์อย่างเหมาะสมโดยใช้ฟังก์ชัน setItemState() และค่าคงที่ที่กำหนด และตั้งค่าสีตามวิธีที่ฉันต้องการให้เลเยอร์ของฉันปรากฏโดยใช้ setValue() ไฟล์การกำหนดค่าที่เป็นผลลัพธ์ที่ได้รับการบันทึกสามารถคัดลอกไปยังโฟลเดอร์ configs และโหลดโดยผู้ใช้

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

ขั้นตอนที่ 6: พื้นที่สำหรับการปรับปรุง

หลังจากพิจารณาการใช้งานซอฟต์แวร์ของฉันแล้ว ฉันได้ระบุประเด็นต่างๆ ที่อาจเป็นประโยชน์ต่อการปรับปรุงสำหรับผู้ใช้ระดับสูง

1. การเรนเดอร์เลเยอร์แบบไดนามิก ขณะนี้ ฉันมีรายการเลเยอร์ที่กำหนดไว้ล่วงหน้าที่จะแสดงผล นั่นคือทั้งหมด เหตุผลส่วนหนึ่งคือความยากลำบากในการพิจารณาว่าเลเยอร์ควรเป็นเส้นหรือเติม ด้วยเหตุนี้ ในเกือบทุกไฟล์ OSM ที่คุณเปิด คุณจะได้รับคำเตือนมากมายเกี่ยวกับเลเยอร์ที่จะไม่แสดงผล บ่อยครั้งสิ่งเหล่านี้มีน้อยมาก แต่ก็ไม่ใช่ปัญหา แต่มีเลเยอร์ที่สำคัญขาดหายไป การเรนเดอร์เลเยอร์แบบไดนามิกจะช่วยขจัดข้อกังวลเหล่านี้
2. การกำหนดเลเยอร์แบบไดนามิก สิ่งนี้ไปควบคู่กับ #1; หากคุณต้องการเรนเดอร์เลเยอร์แบบไดนามิก คุณต้องกำหนดเลเยอร์ไดนามิก (เช่น การระบุเลเยอร์การเติมกับเลเยอร์ของเส้น) สิ่งนี้สามารถทำได้อย่างสมเหตุสมผล ตามที่ฉันได้เรียนรู้ เพราะวิธีที่โหนดแรกและโหนดสุดท้ายเหมือนกันจะถูกปิดล้อมและด้วยเหตุนี้จึงถูกเติมเต็ม
3. กลุ่มสี แผนที่ที่มีสไตล์มักมีหลายเลเยอร์ที่มีสไตล์เหมือนกัน และการอนุญาตให้ผู้ใช้แก้ไขรูปแบบของกลุ่มทั้งหมดพร้อมกัน จะช่วยลดเวลาของผู้ใช้ที่ใช้แก้ไขเลเยอร์ทีละชั้นได้อย่างมาก

ขั้นตอนที่ 7: ปิดความคิด

ขอบคุณทุกคนที่สละเวลาอ่าน Instructable ของฉัน โปรเจ็กต์นี้แสดงให้เห็นถึงจุดสุดยอดของการวิจัย การออกแบบ การเขียนโปรแกรม และการดีบักเป็นเวลาหลายชั่วโมง ฉันหวังว่าฉันจะสามารถจัดหา Launchpad ซึ่งคุณสามารถสร้างโครงการของคุณเองหรือต่อยอดจากสิ่งที่ฉันได้เขียนไปแล้ว ฉันหวังว่าข้อบกพร่องและเคล็ดลับของฉันจะให้ประเด็นมากมายที่ต้องพิจารณาในการออกแบบของคุณ หากคุณไม่ค่อยอยากเขียนโปรแกรมและมีแนวโน้มว่าจะสร้างสรรค์ผลงานศิลปะมากขึ้น ฉันชอบที่จะเห็นสิ่งที่คุณทำในความคิดเห็น! ความเป็นไปได้ไม่มีที่สิ้นสุด!

ขอขอบคุณเป็นพิเศษสำหรับผู้สนับสนุน OpenStreetMap! โครงการเช่นนี้จะเกิดขึ้นไม่ได้หากปราศจากความพยายามที่สำคัญ

โปรดแจ้งให้เราทราบหากคุณมีคำถามใด ๆ ในความคิดเห็น!

รองชนะเลิศในการท้าทายแผนที่