ปรับแต่งแผนที่ 3 มิติ

คุณสามารถปรับแต่งรูปลักษณ์ของแผนที่ฐาน 3 มิติได้โดยใช้การจัดรูปแบบแผนที่ในระบบคลาวด์

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

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

ตัวอย่างต่อไปนี้แสดงแผนที่ที่ใช้สไตล์ที่กำหนดเองเพื่อเปลี่ยนสีของไอคอนและข้อความของฟีเจอร์สันทนาการเป็นสีส้ม

async function init() {
    const { Map3DElement } = await google.maps.importLibrary('maps3d');

    const map = new Map3DElement({
        center: {
            lat: 37.75183154601466,
            lng: -119.52369070507672,
            altitude: 2200,
        },
        tilt: 67.5,
        heading: 108.94057782079429,
        range: 6605.57279990986,
        mapId: 'bcce776b92de1336e22c569f', // Styles are associated with map IDs.
        mode: 'HYBRID',
        gestureHandling: 'COOPERATIVE',
    });

    document.body.append(map);
}

void init();

ภาพรวม

กระบวนการปรับแต่งแผนที่ 3 มิติโดยใช้การจัดรูปแบบแผนที่ในระบบคลาวด์จะเหมือนกับแผนที่ 2 มิติ โดยมีขั้นตอนดังนี้

1 สร้างรหัสแผนที่ สร้างรหัสแผนที่ จากนั้นส่งรหัสแผนที่ไปยังแอปพลิเคชันเพื่อจัดการการจัดรูปแบบ และคุณจะเชื่อมโยงสไตล์ที่กำหนดเองกับรหัสแผนที่นี้ในขั้นตอนต่อๆ ไป
2 สร้างสไตล์แผนที่ในระบบคลาวด์ คุณต้องเลือก "ไฮบริด 3 มิติ" และใช้ "โหมดสว่าง" ในขั้นตอนนี้
3 เชื่อมโยงรูปแบบแผนที่กับแผนที่ ลิงก์สไตล์ กับรหัสแผนที่ที่คุณสร้างในขั้นตอนที่ 1
4 เพิ่มรหัสแผนที่ลงในแอปพลิเคชัน ระบุรหัสแผนที่ในโค้ดโดยใช้พารามิเตอร์ map-id
5 เผยแพร่รหัสแผนที่ โปรดทราบว่าระบบจะรวมการเปลี่ยนแปลงสไตล์ที่กำหนดเองเข้ากับแอปพลิเคชันโดยอัตโนมัติหลังจากเผยแพร่

หากต้องการดูรายละเอียดเกี่ยวกับการสร้างสไตล์แผนที่ โปรดอ่านหัวข้อ สร้างและใช้สไตล์ แผนที่

ข้อจำกัด

โปรดทราบว่าการใช้การจัดรูปแบบแผนที่ในระบบคลาวด์กับแผนที่ 3 มิติใน Maps JavaScript มีข้อจำกัดบางประการดังนี้

  • ไม่รองรับโหมดมืด
  • ไม่รองรับฟีเจอร์ที่ใช้รหัสแผนที่ เช่น การจัดรูปแบบตามข้อมูล