שימוש במזהי מפה

מזהה מפה הוא מזהה ייחודי שמשמש לייצוג מופע יחיד של מפה של Google. אתם משתמשים במזהי מפה כדי להפעיל תכונות, לנהל מפות או לקבוע את הסגנון שלהן באתרים ובאפליקציות שלכם. אפשר ליצור מזהי מפה לכל פלטפורמה שדרושה לכם – JavaScript, ‏ Android, ‏ iOS או מפות סטטיות – בפרויקט שלכם במסוף Google Cloud, בדף ניהול מפות.

מה אפשר לעשות עם מזהי מפות

משתמשים במזהי מפות כדי להפעיל תכונות וסגנונות. ריכזנו כאן כמה דוגמאות לשימוש במזהי מפות. הרשימה המלאה מופיעה במאמר תכונות שמשתמשות במזהי מפה:

  • עיצוב מפות מבוסס-ענן: שיוך מזהה מפה לסגנון מפה כדי לעצב, להתאים אישית ולנהל את המפות באמצעות מסוף Google Cloud. השירות זמין בכל הפלטפורמות: JavaScript,‏ Android,‏ iOS ו-Maps Static API.

  • מפות וקטורים: שימוש במזהה מפה כדי להשתמש במפה שמכילה משבצות מבוססות-וקטור שמצוירות בזמן הטעינה בצד הלקוח באמצעות WebGL. זמין ב-JavaScript.

  • סמנים מתקדמים: משתמשים במזהה מפה כדי להפעיל סמנים מתקדמים. האפשרות זמינה ב-JavaScript, ב-Android וב-iOS.

דוגמה לעיצוב מפות מבוסס-ענן

כדי להשתמש בעיצוב מפות מבוסס-ענן כדי לעצב מפות באתר ובאפליקציות ל-Android:

  1. יוצרים מזהי מפה לכל פלטפורמה שבה אתם משתמשים. לדוגמה, אפשר ליצור מזהה מפה של JavaScript ושל Android. פרטים נוספים זמינים במאמר יצירת מזהי מפות.

  2. הגדרת סגנון מפה במסוף Google Cloud. מידע נוסף זמין במאמר עיצוב מפות מבוסס-ענן.

  3. משייכים את שני מזהי המפה לסגנון המפה במסוף Google Cloud. פרטים נוספים זמינים במאמר שיוך מזהי מפה לסגנון.

  4. מפנים למזהה המפה בקוד ה-JavaScript של האתר ובקוד של אפליקציית Android. פרטים נוספים זמינים במאמר הוספת מזהה מפה לאפליקציה.

לאחר מכן, סגנון המפה שמשויך למזהי המפה יוצג באתר ובאפליקציה ל-Android. תוכלו לעדכן את סגנון המפה במסוף Cloud, והשינויים יופיעו בשני המקומות באופן אוטומטי, בלי שהלקוחות יצטרכו לעדכן את האפליקציה.

תכונות שמשתמשות במזהי מפה

בטבלה הבאה מפורטות התכונות וממשקי ה-API של פלטפורמת מפות Google שמשתמשים במזהי מפות:

תכונה או ממשק API משתמשים במזהי מפות כדי להשיג את היעדים האלה
סמנים מתקדמים מפעילים את הסימנים המתקדמים. אין צורך ליצור מזהה מפה, ובמקום זאת אפשר להשתמש במזהה המפה לדוגמה DEMO_MAP_ID.
סגנון מבוסס-נתונים לגבולות משייכים את מזהה המפה לקבוצה של גבולות וסגנונות כדי לעצב את המפה בהתאם לגבולות.
סגנון מבוסס-נתונים למערכי נתונים משייכים את מזהה המפה לקבוצת נתונים ולסגנון כדי לעצב את המפה בהתאם למערך הנתונים.
Flutter עיצוב של מפות Google שמשמשות באפליקציות Flutter.
Maps Embed API ציון המפה שרוצים להטמיע בדף אינטרנט והגדרת הסגנון שלה.
Maps JavaScript API עיצוב המפה כך שתוצג בדף אינטרנט.
SDK של מפות ל-Android עיצוב המפה כך שתוצג באפליקציה ל-Android.1
SDK של מפות ל-iOS מעצבים את המפה כך שתוצג באפליקציה ל-iOS.1
Maps Static API מציינים את המפה ומגדירים לה סגנון כדי שהיא תומר כתמונה סטטית.
פתרונות ניידות משתמשים בממשק API של JavaScript למפות וב-SDKs ל-Android ול-iOS כדי לעצב מפות בפתרונות תחבורה.1
WebGL (מפות וקטורים) הפעלת תכונות WebGL באמצעות מזהה מפה וקטורית של JavaScript.

1 שימוש במזהה מפה ב-SDK של מפות ל-Android או ב-SDK של מפות ל-iOS מפעיל טעינת מפה, והחיוב מתבצע על המק"ט של מפות דינמיות.

איך יוצרים מזהי מפה ומשתמשים בהם

מזהה מפה הוא מזהה ייחודי שמייצג מופע יחיד של מפת Google. יוצרים מזהי מפה ומעדכנים את סגנון המפה שמשויך למזהה המפה ב-Cloud Console.

ההרשאות הנדרשות

כדי ליצור או לנהל מזהי מפות בפרויקט, צריך להשתמש בחשבון משתמש עם ההרשאות המתאימות ברמת התפקיד, 'עריכה' או 'בעלים', בדף IAM של הפרויקט במסוף Cloud. למידע נוסף, ראו מסמך עזר בנושא תפקידים בסיסיים ומוגדרים מראש ב-IAM.

יצירת מזהי מפה

אפשר ליצור מזהי מפה ולעדכן את הסגנון שמשויך למזהה מפה בכל שלב במסוף Cloud.

כדי ליצור מזהה מפה:

  1. נכנסים לפרויקט במסוף Cloud ופותחים אותו עם ההרשאות הנדרשות.

  2. נכנסים לדף Maps Management במסוף Cloud.

  3. בוחרים באפשרות יצירת מזהה מפה.

    יצירת מזהה מפה חדש

  4. בדף Create new map ID, מבצעים את הפעולות הבאות:

    1. בשדה Name, נותנים שם למזהה המפה.
    2. אופציונלי: בקטע תיאור, מתארים למה משמש מזהה המפה.
    3. בקטע סוג המפה, בוחרים את הפלטפורמה שבה מתכוונים להשתמש במזהה המפה. אם בוחרים ב-JavaScript, צריך לבחור גם סוג מפה: Raster (ברירת המחדל) או Vector. מידע נוסף על מפות וקטורים זמין במאמר מפות וקטורים.
    4. בוחרים באפשרות Save כדי להציג את מזהה המפה החדש.

שיוך מזהה מפה לסגנון מפה

ההנחה בהוראות האלה היא שיש לפחות סגנון מפה אחד בפרויקט. אם אין לכם סגנונות מפות, תוכלו לקרוא את המאמר עיצוב מפות מבוסס-ענן ולבחור את הפלטפורמה שלכם כדי לקבל הוראות ליצירת סגנון.

  1. נכנסים לדף Maps Management במסוף Cloud.
  2. בוחרים מזהה מפה קיים מהטבלה.
  3. בקטע סגנון המפה המשויך, בוחרים סגנון מפה.
  4. לוחצים על שמירה.

    דף הפרטים של מזהה המפה, שבו משייכים סגנון מפה

הוספת מזהה המפה לאפליקציה

Android

מוסיפים את מזהה המפה באמצעות רכיב <fragment> בקובץ הפריסה של הפעילות, באמצעות הכיתה MapView או באופן פרוגרמטי באמצעות הכיתה GoogleMapOptions.

לדוגמה, נניח שיצרתם מזהה מפה שמאוחסן כערך מחרוזת בשם map_id ב-res/values/strings.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="map_id">MAP_ID</string>
</resources>

במפות שנוספו באמצעות אלמנט <fragment> בקובץ הפריסה של הפעילות, צריך לציין את מזהה המפה במאפיין map:mapId בכל קטעי המפה שרוצים להחיל עליהם את הסגנון המותאם אישית:

<fragment xmlns:map="http://schemas.android.com/apk/res-auto"
    map:name="com.google.android.gms.maps.SupportMapFragment"
    …
    map:mapId="@string/map_id" />

אפשר גם להשתמש במאפיין map:mapId של הכיתה MapView כדי לציין מזהה מפה:

<com.google.android.gms.maps.MapView
    xmlns:android="http://schemas.android.com/apk/res/android"
    ....
    map:mapId="@string/map_id" />

כדי לציין מזהה מפה באופן פרוגרמטי, מעבירים אותו למכונה של MapFragment באמצעות הכיתה GoogleMapOptions:

Java

 MapFragment mapFragment = MapFragment.newInstance(
     new GoogleMapOptions()
         .mapId(getResources().getString(R.string.map_id)));

Kotlin

 val mapFragment = MapFragment.newInstance(
     GoogleMapOptions()
         .mapId(resources.getString(R.string.map_id))
 )

ב-Android Studio, יוצרים ומפעילים את האפליקציה כרגיל. הסגנונות המותאמים אישית שהוגדרו בשלב הראשון יחולו על כל המפות עם מזהה המפה שצוין.

iOS

כדי ליצור מופע של מפה באמצעות מזהה מפה, מבצעים את הפעולות הבאות:

  1. יוצרים GMSMapID עם מחרוזת מזהה המפה מ-Cloud Console.
  2. יוצרים GMSMapView ומציינים את מזהה המפה שיצרתם.

Swift

let camera = GMSCameraPosition(latitude: 47.0169, longitude: -122.336471, zoom: 12)
let mapID = GMSMapID(identifier: "MAP_ID")
let mapView = GMSMapView(frame: .zero, mapID: mapID, camera: camera)
self.view = mapView

Objective-C

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:47.0169
                                                        longitude:-122.336471
                                                             zoom:12];
GMSMapID *mapID = [GMSMapID mapIDWithIdentifier:@"MAP_ID"];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:camera];
self.view = mapView;

אם אתם משתמשים במזהה מפה משלכם, אתם יכולים להגדיר לו סגנון חדש במסוף Cloud בכל שלב, והסגנון הזה ישתקף בתצוגת המפה שלכם באופן אוטומטי תוך כ-6 שעות.

אם רוצים לראות את השינויים באופן מיידי, אפשר לסגור את האפליקציה ולהפעיל אותה מחדש. לשם כך, יוצאים מהאפליקציה, גורמים לה לצאת מרשימת האפליקציות שבהן השתמשת לאחרונה ואז פותחים אותה מחדש. המפה המעודכנת תהיה גלויה.

JavaScript

כדי ליצור מפה עם מזהה מפה בקוד האפליקציה:

  1. אם כבר התאמתם אישית את המפה באמצעות קוד JSON מוטמע, צריך להסיר את הנכס styles מהאובייקט MapOptions. אחרת, אפשר לדלג על השלב הזה.

  2. מוסיפים למפה מזהה מפה באמצעות הנכס mapId. לדוגמה:

map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
mapId: 'MAP_ID'
});

Maps Static

כדי להוסיף מזהה מפה למפה חדשה או קיימת שמשתמשת באחד מממשקי ה-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=MAP_ID&signature=YOUR_SIGNATURE" />

מפה שממוקדת בגשר ברוקלין בעיר ניו יורק, ניו יורק, ארה&quot;ב, עם פקדי מפה בפינה השמאלית התחתונה. במפה מוצג סגנון מותאם אישית של הכבישים, המים והאדמה.

אם יש לכם חתימה דיגיטלית בכתובת ה-URL הסטטית של מפות Google לפני הוספת מזהה המפה, תצטרכו ליצור חתימה דיגיטלית חדשה ולהוסיף אותה אחרי הוספת מזהה המפה. כשיוצרים את הסוד החדש לחתימה על כתובות URL, חשוב להסיר את החתימה הדיגיטלית הקודמת מכתובת ה-URL.