سفارشی‌سازی نقشه‌های سه‌بعدی

می‌توانید ظاهر و حس نقشه پایه سه‌بعدی را بااستفاده از سبک‌پردازی نقشه بااستفاده از فضای ابری سفارشی‌سازی کنید.

با سبک‌پردازی نقشه بااستفاده از فضای ابری، می‌توانید ظاهر و حس نقشه‌ای را که به کاربران ارائه می‌دهید کنترل کنید. با کنترل کردن ویژگی‌هایی مثل تراکم مکان‌های جالب (POI)، برداشتن برخی‌از دسته‌های POI، و اصلاح کردن رنگ‌آمیزی یا خطوط ویژگی‌ها، می‌توانید تجربه نقشه‌ای ایجاد کنید که برای کاربران شما سفارشی‌سازی شده باشد.

سبک‌پردازی نقشه بااستفاده از فضای ابری تجربه ویرایش بدون کد در کنسول Google Cloud ارائه می‌دهد. هر سبک سفارشی که ایجاد می‌کنید با یک شناسه نقشه مرتبط است؛ ویرایش‌های انجام‌شده در سبک شما در کنسول نقشه‌ها به‌طور خودکار در برنامه شما ظاهر می‌شود.

مثال زیر نقشه‌ای را نشان می‌دهد که از سبک سفارشی برای تغییر رنگ نمادها و نوشتار ویژگی تفریحی به نارنجی استفاده می‌کند:

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',
    });

    document.body.append(map);
}

void init();

نمای کلی

فرایند سفارشی‌سازی نقشه‌های سه‌بعدی بااستفاده از سبک‌پردازی نقشه بااستفاده از فضای ابری همانند نقشه‌های دوبعدی است:

۱ ایجاد شناسه نقشه شناسه نقشه ایجاد کنید. شناسه‌های نقشه به برنامه شما ارسال می‌شود تا سبک‌دهی را مدیریت کند. در مراحل بعدی، سبک سفارشی را با این شناسه نقشه قرینه‌سازی خواهید کرد.
۲ ایجاد سبک نقشه بااستفاده از فضای ابری در این مرحله باید «ترکیبی سه‌بعدی» را انتخاب کنید و از «حالت روشن» استفاده کنید.
3 مرتبط کردن سبک نقشه با نقشه سبکتان را به شناسه نقشه‌ای که در مرحله یک ایجاد کردید پیوند دهید
۴ افزودن شناسه نقشه به برنامه شناسه نقشه را در کدتان بااستفاده از پارامتر map-id مشخص کنید.
۵ شناسه نقشه را منتشر کنید توجه داشته باشید که تغییرات سبک سفارشی شما پس‌از انتشار به‌طور خودکار در برنامه‌تان گنجانده می‌شود.

برای نگاهی عمیق به ایجاد سبک‌های نقشه، ایجاد و استفاده از سبک‌های نقشه را مرور کنید.

به‌روزرسانی شناسه نقشه به‌صورت پویا

پس‌از نمونه‌سازی نقشه می‌توانید دارایی mapId را به‌صورت پویا به‌روز کنید. این کار به شما امکان می‌دهد سبک نقشه مبتنی بر ابر متفاوتی را بدون نیاز به بازآفرینی کل نمونه Map3DElement اعمال کنید.

برای به‌روزرسانی شناسه نقشه، دارایی mapId را در نمونه Map3DElement تنظیم کنید:

const map3DElement = document.querySelector('gmp-map-3d');

// Update the map ID dynamically
map3DElement.mapId = 'YOUR_MAP_ID';

چون ویژگی mapId به مشخصه HTML برمی‌گردد، می‌توانید آن را با اصلاح مشخصه به‌صورت پویا به‌روز کنید:

const map3DElement = document.querySelector('gmp-map-3d');

// Alternatively, set the map-id attribute
map3DElement.setAttribute('map-id', 'YOUR_MAP_ID');

محدودیت‌ها

هنگام استفاده از سبک‌پردازی نقشه بااستفاده از فضای ابری با «نقشه‌های سه‌بعدی» در Maps JavaScript، محدودیت‌های خاصی وجود دارد که باید از آن‌ها آگاه باشید:

  • از حالت تاریک پشتیبانی نمی‌شود.
  • ویژگی‌های فعال‌شده با شناسه نقشه، مثل سبک‌بندی داده‌محور، پشتیبانی نمی‌شوند.