הוספת מפה עם סמן

המדריך הזה מראה איך להוסיף מפת Google פשוטה עם סמן ל-iOS אפליקציה. הוא מתאים לאנשים עם ידע מתחיל או בינוני ב-Swift או Objective-C וידע כללי של Xcode. לקבלת מדריך מתקדם ליצור מפות, לקרוא את מותאמת אישית.

המדריך הזה ייצור את המפה הבאה. הסמן ממוקם ב- סידני, אוסטרליה.

קבל את הקוד

משכפלים או מורידים את מאגר הדוגמאות של מפות Google ל-iOS ב-GitHub.

לחלופין, לוחצים על הלחצן הבא כדי להוריד את קוד המקור:

אני רוצה לקבל את הקוד

Swift

import UIKit
import GoogleMaps

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        // Create a GMSCameraPosition that tells the map to display the
        // coordinate -33.86,151.20 at zoom level 6.
        let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
        let mapView = GMSMapView.map(withFrame: self.view.frame, camera: camera)
        self.view.addSubview(mapView)

        // Creates a marker in the center of the map.
        let marker = GMSMarker()
        marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
        marker.title = "Sydney"
        marker.snippet = "Australia"
        marker.map = mapView
  }
}
      

Objective-C

#import "ViewController.h"
#import <GoogleMaps/GoogleMaps.h>

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
  // Do any additional setup after loading the view.
  // Create a GMSCameraPosition that tells the map to display the
  // coordinate -33.86,151.20 at zoom level 6.
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:6];
  GMSMapView *mapView = [GMSMapView mapWithFrame:self.view.frame camera:camera];
  mapView.myLocationEnabled = YES;
  [self.view addSubview:mapView];

  // Creates a marker in the center of the map.
  GMSMarker *marker = [[GMSMarker alloc] init];
  marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
  marker.title = @"Sydney";
  marker.snippet = @"Australia";
  marker.map = mapView;
}

@end
      

שנתחיל?

מנהל חבילות SWIFT

ניתן להתקין את ה-SDK של מפות Google ל-iOS באמצעות Swift Package Manager.

1. יש לוודא שהסרתם את כל יחסי התלות הקיימים של Maps SDK עבור iOS.
2. פותחים חלון טרמינל ומנווטים לספרייה tutorials/map-with-marker.
3. מוודאים שסביבת העבודה של Xcode סגורה ומריצים את הפקודות הבאות:

   sudo gem install cocoapods-deintegrate cocoapods-clean
   pod deintegrate
   pod cache clean --all
   rm Podfile
   rm map-with-marker.xcworkspace

4. פותחים את פרויקט ה-Xcode ומוחקים את קובץ ה-pod.
5. עוברים אל קובץ > הוספת יחסי תלות של חבילה
6. מזינים את הכתובת https://github.com/googlemaps/ios-maps-sdk בתור כתובת ה-URL, מקישים על Enter כדי למשוך את החבילה ולוחצים על הוספת חבילה.
7. ייתכן שיהיה עליך לאפס את מטמון החבילה באמצעות האפשרות File > חבילות > איפוס המטמון של החבילה.

שימוש ב-CocoaPods

1. הורדה והתקנה של Xcode גרסה 15.0 ואילך.
2. אם עדיין אין לכם CocoaPods, כדי להתקין אותו ב-macOS, מריצים את הפקודה הבאה מהטרמינל:

   sudo gem install cocoapods

3. עוברים לספרייה tutorials/map-with-marker.
4. מריצים את הפקודה pod install. הפעולה הזו תתקין את ה-SDK של מפות Google שצוין ב-Podfile, יחד עם כל יחסי התלות.
5. מריצים את הפקודה pod outdated כדי להשוות בין גרסת ה-Pod מותקנת לבין עדכונים חדשים. אם זוהתה גרסה חדשה, צריך להריץ את הפקודה pod update כדי לעדכן את Podfile ולהתקין את הגרסה העדכנית ביותר של ה-SDK. לפרטים נוספים, אפשר לעיין במדריך של CocoaPods.
6. פותחים (לחיצה כפולה) את map-with-marker.xcworkspace של הפרויקט. כדי לפתוח אותו ב-Xcode. כדי לפתוח את הפרויקט, צריך להשתמש בקובץ .xcworkspace.

קבלת מפתח API והפעלת ממשקי ה-API הנדרשים

כדי להשלים את המדריך הזה, נדרש מפתח Google API מורשה להשתמש ב-SDK של מפות ל-iOS. לחצו על הלחצן הבא כדי לקבל מפתח ולהפעיל את ה-API.

תחילת העבודה

פרטים נוספים זמינים במאמר קבלת מפתח API

הוספה של מפתח ה-API לאפליקציה

מוסיפים את מפתח ה-API ל-AppDelegate.swift באופן הבא:

1. שימו לב שהצהרת הייבוא הבאה נוספה לקובץ:

   import GoogleMaps

2. עריכת השורה הבאה בapplication(_:didFinishLaunchingWithOptions:) שמחליפה את YOUR_API_KEY במפתח ה-API:

   GMSServices.provideAPIKey("YOUR_API_KEY")

הערה: הקוד לדוגמה של המדריך שהושלם מוגדר לפעול כפרויקט Swift Xcode, אבל כולל דוגמאות של Swift ו-Objective-C.

יצירה והפעלה של אפליקציה

1. מחברים מכשיר iOS למחשב, או בוחרים סימולטור מתפריט סכמת Xcode.
2. אם אתם משתמשים במכשיר, מוודאים ששירותי המיקום מופעלים. אם משתמשים בסימולטור, בוחרים מיקום מתוך התכונות תפריט
3. ב-Xcode, לוחצים על האפשרות Product/Run בתפריט (או על אפשרות ההפעלה) סמל הלחצן).
• Xcode יוצר את האפליקציה ולאחר מכן מפעיל אותה במכשיר או בסימולטור.
• אתם אמורים לראות מפה עם סמן במרכז סידני בחוף המזרחי של אוסטרליה, בדומה לתמונה שבדף הזה.

פתרון בעיות:

• אם מפה לא מופיעה, צריך לבדוק שקיבלת מפתח API ושהוספת אותו לאפליקציה, כפי שמתואר למעלה. לבדיקה מסוף ניפוי הבאגים של Xcode בשביל הודעות שגיאה לגבי מפתח ה-API.
• אם הגבלת את מפתח ה-API על ידי מזהה החבילה של iOS, עליך לערוך את מפתח להוספת מזהה החבילה של האפליקציה: com.google.examples.map-with-marker
• מוודאים שיש לכם חיבור טוב ל-Wi-Fi או ל-GPS.
• שימוש בכלים לניפוי באגים של Xcode כדי לצפות ביומנים ולנפות באגים באפליקציה.

הסבר על הקוד

1. אפשר ליצור מפה ולהגדיר אותה כתצוגה ב-viewDidLoad().

   Swift

   // Create a GMSCameraPosition that tells the map to display the
   // coordinate -33.86,151.20 at zoom level 6.
   let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
   let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)
   view = mapView
         

   Objective-C

   // Create a GMSCameraPosition that tells the map to display the
   // coordinate -33.86,151.20 at zoom level 6.
   GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                           longitude:151.20
                                                                zoom:6.0];
   GMSMapView *mapView = [[GMSMapView alloc] initWithFrame: CGRectZero camera:camera];
   self.view = mapView;
         

2. הוספת סמן למפה בviewDidLoad().

   Swift

   // Creates a marker in the center of the map.
   let marker = GMSMarker()
   marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
   marker.title = "Sydney"
   marker.snippet = "Australia"
   marker.map = mapView
         

   Objective-C

   // Creates a marker in the center of the map.
   GMSMarker *marker = [[GMSMarker alloc] init];
   marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
   marker.title = @"Sydney";
   marker.snippet = @"Australia";
   marker.map = mapView;
         

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

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

השלבים הבאים

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