یک ظاهر طراحی نقشه های مبتنی بر ابر

پلتفرم نقشه‌های Google ویژگی‌های طراحی نقشه‌های مبتنی بر ابر را ارائه می‌دهد که سبک، سفارشی‌سازی و مدیریت نقشه‌های شما را با استفاده از Google Cloud Console آسان می‌کند و به شما این امکان را می‌دهد تا بدون نیاز به به‌روزرسانی کد برنامه‌هایتان هر بار که می‌خواهید، یک تجربه نقشه سفارشی برای کاربران خود ایجاد کنید. یک تغییر سبک ایجاد کنید

سبک‌هایی که قبل از 15 سپتامبر 2020 ایجاد شده‌اند، ویژگی‌های طبیعی پیشرفته Google Maps را نشان نمی‌دهند. برای استفاده از پشتیبانی از ویژگی‌های طبیعی پیشرفته Google Maps برای طراحی نقشه خود، باید یک سبک نقشه ایجاد کنید .

استایل نقشه‌های مبتنی بر ابر به شما امکان می‌دهد سبک‌های نقشه را برای هر یک از برنامه‌های خود که از Google Maps استفاده می‌کنند ایجاد و ویرایش کنید، بدون اینکه نیازی به تغییر در کد خود پس از قرار گرفتن شناسه نقشه باشد. تمام تغییرات سبک را می توان در Cloud Console انجام داد، بدون نیاز به مهارت کدنویسی. ظاهر و رنگ بسیاری از عناصر نقشه مانند جاده‌ها، ساختمان‌ها، آب‌ها، نقاط دیدنی و مسیرهای ترانزیت را تغییر دهید.

این ویژگی ها عبارتند از:

  • طراحی نقشه مبتنی بر ابر : به جای اینکه نقشه خود را با کد با استفاده از JSON طراحی کنید، نقشه‌های پویا یا استاتیک خود را در Cloud Console با استفاده از شناسه‌های نقشه و سبک‌های نقشه مدیریت و استایل دهید.
  • نقشه برداری : توسعه دهندگان جاوا اسکریپت می توانند از همان نقشه مبتنی بر بردار شتاب داده شده با WebGL استفاده کنند که در maps.google.com مستقیماً در برنامه های وب خودشان موجود است.
  • فیلتر POI کسب و کار : پنج دسته از نقاط مورد علاقه تجاری را می توان به صورت اختیاری از نمایش نقشه حذف کرد.
  • کنترل تراکم POI : تراکم نقاط مورد علاقه نشان داده شده در نقشه پایه را می توان به طور پیش فرض تنظیم کرد تا نقاط مورد علاقه بیشتر یا کمتر را نشان دهد.

در حالی که طراحی نقشه‌های مبتنی بر Cloud در Maps SDK برای Android 1 ، Maps SDK برای iOS ، جاوا اسکریپت و Maps Static API در دسترس است، همه ویژگی‌ها در همه پلتفرم‌ها قابل مشاهده نیستند.

قبل از اینکه شروع کنی

  • یک شناسه نقشه ایجاد کنید
    برای استفاده از طرح‌بندی نقشه‌های مبتنی بر ابر، نقشه شما باید با استفاده از شناسه نقشه بارگیری شود.
  • مهاجرت از یک ظاهر طراحی سخت
    قبل از افزودن شناسه نقشه برای استفاده از طرح‌بندی نقشه‌های مبتنی بر Cloud بر روی نقشه‌های موجود که با استایل‌های کدگذاری سخت مانند JSON یا پارامترهای جستجوی URL سفارشی شده است، توصیه می‌کنیم برای جلوگیری از تضاد احتمالی با عملکرد آینده، استایل کدگذاری شده را حذف کنید. می توانید استایل JSON خود را به سبک نقشه جدید وارد کنید .
* Maps SDK را برای اندروید ارتقا دهید
برای استفاده از طرح‌بندی نقشه‌های مبتنی بر Cloud، باید از نسخه ۱۸.۰.۰ یا جدیدتر Maps SDK برای Android استفاده کنید و از جدیدترین رندر Maps SDK برای Android استفاده کنید .

صورتحساب

استفاده از طرح‌بندی نقشه‌های مبتنی بر ابر به شناسه نقشه نیاز دارد. در Maps SDK برای Android، Maps SDK برای iOS و جاوا اسکریپت، استفاده از شناسه نقشه هزینه‌ای را برای SKU نقشه‌های پویا تحمیل می‌کند. در Maps Static API، استفاده از شناسه نقشه هزینه ای را برای SKU Maps استاتیک تحمیل می کند.

مثال ها

اندروید

برنامه نمونه ApiDemos را اجرا کنید

برای اجرای برنامه نمونه ApiDemos، نمونه GitHub ( جاوا | Kotlin ) را ببینید و نسخه نمایشی CloudBasedMapStylingDemoActivity ( جاوا | Kotlin ) را مشاهده کنید.

می توانید یک نمونه برنامه جاوا و کاتلین پیدا کنید که نحوه استایل دادن به نقشه اندروید خود را از فضای ابری نشان می دهد.

مشکلات شناخته شده

هنگامی که برنامه شما به مشتریان تحویل داده شد، سبک های سفارشی برای نقشه ها با شناسه نقشه می توانند از Google Cloud Console به روز شوند. استایل های جدید تا چند ساعت دیگر در اپلیکیشن شما منعکس خواهند شد.

برای اطمینان از اینکه سبک‌های سفارشی جدید فوراً برای اهداف آزمایشی نشان داده می‌شوند، داده‌های برنامه را از دستگاه آزمایشی خود پاک کنید. برای اطلاعات بیشتر درباره پاک کردن داده‌ها از دستگاهتان، به راهنمای Android - آزاد کردن فضا مراجعه کنید.

توجه داشته باشید که تنظیمات ممکن است بر اساس تلفن متفاوت باشد. برای اطلاعات بیشتر، با سازنده دستگاه خود تماس بگیرید .

iOS

برنامه نمونه ApiDemos را اجرا کنید

برای اجرای برنامه نمونه ApiDemos، نمونه برنامه GoogleMap GitHub را ببینید و پروژه CloudBasedMapStylingViewController (نمونه GitHub برای Swift | Objective-C ) را مشاهده کنید.

نسخه ی نمایشی CocoaPod یا GitHub Styling Cloud اختیاری

به جای شروع از ابتدا، می توانید برنامه نمونه Objective-C ما را امتحان کنید که نحوه استایل دادن به نقشه iOS خود را از ابر در اینجا نشان می دهد.

ساخت برنامه آزمایشی بتا

در Xcode، دکمه کامپایل را فشار دهید تا بسازید و سپس طرح فعلی را اجرا کنید. بیلد یک خطا ایجاد می کند و از شما می خواهد که کلید API خود را در فایل SDKDemoAPIKey.h وارد کنید.

اگر هنوز کلید API ندارید، این دستورالعمل ها را دنبال کنید تا پروژه ای را در Cloud Console راه اندازی کنید و یک کلید API دریافت کنید. هنگام پیکربندی کلید در Cloud Console، می‌توانید شناسه بسته برنامه خود را مشخص کنید تا مطمئن شوید که فقط برنامه شما می‌تواند از کلید استفاده کند. شناسه بسته پیش‌فرض برنامه نمونه‌های SDK com.example.GoogleMapsDemos است.

فایل SDKDemoAPIKey.h را ویرایش کنید و کلید API خود را در تعریف ثابت kAPIKey قرار دهید:

```
static NSString *const kAPIKey = @"YOUR_API_KEY";
```

اگر Xcode از شما خواست قفل فایل SDKDemoAPIKey.h را برای ویرایش باز کنید، Unlock را انتخاب کنید.

خط زیر را حذف کنید:

```
#error Register for API Key and insert here.
```

پروژه را بسازید و اجرا کنید.

نسخه ی نمایشی نقشه یک ظاهر طراحی نقشه های مبتنی بر ابر

نسخه ی نمایشی CloudStyling نحوه استایل دادن به نقشه را با استفاده از یک مجموعه سبک در Google Cloud Console نشان می دهد.

هنگامی که برنامه آزمایشی راه اندازی شد، روی نسخه نمایشی سفارشی سازی نقشه در بخش نمونه های بتا در بالای لیست کلیک کنید.

روی Style Map کلیک کنید تا اثر بارگذاری شناسه های مختلف نقشه را ببینید.

می توانید سبک خود را نیز اضافه کنید ("Style Map" > "Add a new Map ID")، و به روز رسانی نقشه را با نقشه سبک سفارشی خود مشاهده کنید.

جاوا اسکریپت

این یک مثال اساسی از بارگیری یک نقشه سبک سفارشی با استفاده از شناسه نقشه است. در این مورد، 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;
index.ts

جاوا اسکریپت

function initMap() {
  new google.maps.Map(document.getElementById("map"), {
    mapId: "8e0a97af9386fef",
    center: { lat: 48.85, lng: 2.35 },
    zoom: 12,
  });
}

window.initMap = initMap;
index.js
مشاهده نمونه

Sample را امتحان کنید

Maps Static API

شناسه نقشه یک شناسه است که با یک سبک یا ویژگی خاص نقشه مرتبط است. یک سبک نقشه را پیکربندی کنید و آن را با شناسه نقشه در Google Cloud Console مرتبط کنید. سپس، هنگامی که به شناسه نقشه در کد خود اشاره می کنید، سبک نقشه مرتبط با آن در برنامه شما نمایش داده می شود. هر گونه به‌روزرسانی سبک بعدی که ایجاد می‌کنید به‌طور خودکار در برنامه‌تان ظاهر می‌شود، بدون اینکه نیازی به به‌روزرسانی توسط مشتریانتان باشد.

  1. اگر از طرح‌بندی نقشه‌های مبتنی بر ابر با نقشه‌های موجود استفاده می‌کنید که با پارامتر style سفارشی‌سازی شده است، حتماً آن‌ها را حذف کنید تا از تضاد احتمالی با عملکرد آینده جلوگیری کنید.

  2. برای افزودن شناسه نقشه به نقشه جدید یا موجود که از یکی از APIهای وب ما استفاده می کند، پارامتر URL map_id را اضافه کرده و آن را به شناسه نقشه خود تنظیم کنید. این مثال اضافه کردن شناسه نقشه را با استفاده از Maps Static API به نقشه نشان می‌دهد.

    <img src="https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY&map_id=YOUR_MAP_ID&signature=YOUR_SIGNATURE" />

  1. طراحی نقشه‌های مبتنی بر ابر در حالت Lite Android در دسترس نیست. ↩