Google Maps Platform มีฟีเจอร์การจัดรูปแบบแผนที่บนระบบคลาวด์ ซึ่งทำให้คุณสามารถจัดรูปแบบ ปรับแต่ง และจัดการแผนที่ได้ง่ายๆ โดยใช้ Google Cloud Console ซึ่งช่วยให้คุณสร้างประสบการณ์แผนที่ที่กำหนดเอง สำหรับผู้ใช้ โดยไม่ต้องอัปเดตโค้ดของแอปทุกครั้งที่คุณทำการเปลี่ยนแปลงรูปแบบ
สไตล์ที่สร้างก่อนวันที่ 15 กันยายน 2020 จะไม่แสดงฟีเจอร์ธรรมชาติที่เพิ่มประสิทธิภาพของ Google Maps หากต้องการใช้ฟีเจอร์ธรรมชาติที่ปรับปรุงแล้วของ Google Maps สำหรับการจัดรูปแบบแผนที่ คุณต้องสร้างรูปแบบแผนที่
การจัดรูปแบบแผนที่ในระบบคลาวด์ช่วยให้คุณสร้างและแก้ไขรูปแบบแผนที่สำหรับแอปทั้งหมดที่ใช้ Google Maps ได้ โดยที่ไม่ต้องเปลี่ยนแปลงโค้ดใดๆ เลยเมื่อมีรหัสแผนที่แล้ว การเปลี่ยนแปลงสไตล์ทั้งหมดจะทำได้ใน Cloud Console โดยไม่ต้องมีทักษะการเขียนโค้ด เปลี่ยนลักษณะและสีขององค์ประกอบหลายๆ อย่างในแผนที่ เช่น ถนน อาคาร แหล่งน้ำ จุดสนใจ และเส้นทางขนส่งสาธารณะ
รวมถึงฟีเจอร์ต่อไปนี้
- การจัดรูปแบบแผนที่บนระบบคลาวด์: แทนที่จะจัดรูปแบบแผนที่เป็นโค้ดโดยใช้ JSON คุณจะจัดการและจัดรูปแบบแผนที่แบบไดนามิกหรือแบบคงที่ใน Cloud Console โดยใช้รหัสแผนที่และรูปแบบแผนที่แทน
- แผนที่เวกเตอร์: นักพัฒนาซอฟต์แวร์ JavaScript สามารถเลือกใช้แผนที่แบบเวกเตอร์ที่เร่งความเร็วด้วย WebGL เดียวกันนี้ที่มีให้ใช้งานบน maps.google.com โดยตรงในเว็บแอป
- การกรองจุดที่น่าสนใจของธุรกิจ: คุณเลือกนำจุดสนใจของธุรกิจออกจากการแสดงแผนที่ได้ 5 หมวดหมู่
- การควบคุมความหนาแน่นของจุดที่น่าสนใจ: ปรับความหนาแน่นของจุดสนใจที่แสดงบนแผนที่ฐานให้แสดงจุดที่น่าสนใจมากขึ้นหรือน้อยลงได้โดยค่าเริ่มต้น
แม้ว่าการจัดรูปแบบแผนที่บนระบบคลาวด์จะใช้งานได้ใน Maps SDK สำหรับ Android1, Maps SDK สำหรับ iOS, JavaScript และ Maps Static API แต่บางแพลตฟอร์มอาจไม่แสดงฟีเจอร์
ข้อควรปฏิบัติก่อนที่จะเริ่มต้น
- สร้างรหัสแผนที่
หากต้องการจัดรูปแบบแผนที่ในระบบคลาวด์ คุณต้องโหลดแผนที่โดยใช้รหัสแผนที่ - เปลี่ยนจากการจัดรูปแบบแบบฮาร์ดโค้ด
ก่อนที่จะเพิ่มรหัสแผนที่เพื่อใช้การจัดรูปแบบแผนที่ระบบคลาวด์บนแผนที่ที่มีอยู่ซึ่งปรับแต่งด้วยสไตล์แบบฮาร์ดโค้ด เช่น JSON หรือพารามิเตอร์การค้นหา URL เราขอแนะนำให้คุณนำสไตล์แบบฮาร์ดโค้ดออกเพื่อหลีกเลี่ยงความขัดแย้งที่อาจเกิดขึ้นกับฟังก์ชันการทำงานในอนาคต คุณนำเข้าการจัดรูปแบบ JSON เป็นรูปแบบแผนที่ใหม่ได้- ใน Android ให้อัปเดต
MapStyleOptions
- อัปเดตชั้นเรียน
GMSMapStyle
ใน iOS - ใน JavaScript ให้นำการจัดรูปแบบ
MapTypeStyle
ออก - ใน Maps Static ให้นำพารามิเตอร์
style
ออก
- ใน Android ให้อัปเดต
การเรียกเก็บเงิน
การใช้การจัดรูปแบบแผนที่ในระบบคลาวด์ต้องใช้รหัสแผนที่ ใน Maps SDK สำหรับ Android, Maps SDK สำหรับ iOS และ JavaScript จะมีการเรียกเก็บเงินสำหรับ Dynamic Maps SKU โดยใช้รหัสแผนที่ สำหรับ Maps Static API การใช้รหัสแผนที่จะมีการเรียกเก็บค่าบริการจาก SKU ของแผนที่แบบคงที่
ตัวอย่าง
นี่คือตัวอย่างพื้นฐานของการโหลดแผนที่ที่มีการจัดรูปแบบที่กำหนดเองโดยใช้รหัสแผนที่ ในกรณีนี้ Maps JavaScript จะอ้างอิงรหัสแผนที่ 8e0a97af9386fef
เมื่อโหลดแผนที่ และจะใช้รูปแบบแผนที่ปัจจุบันที่เชื่อมโยงกับรหัสแผนที่นั้นโดยอัตโนมัติ
TypeScript
function initMap(): void { new google.maps.Map( document.getElementById("map") as HTMLElement, { mapId: "8e0a97af9386fef", center: { lat: 48.85, lng: 2.35 }, zoom: 12, } as google.maps.MapOptions ); } declare global { interface Window { initMap: () => void; } } window.initMap = initMap;
JavaScript
function initMap() { new google.maps.Map(document.getElementById("map"), { mapId: "8e0a97af9386fef", center: { lat: 48.85, lng: 2.35 }, zoom: 12, }); } window.initMap = initMap;
ลองใช้ตัวอย่าง
-
การจัดรูปแบบแผนที่บนระบบคลาวด์ไม่พร้อมใช้งานในโหมด Lite ของ Android↩