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

במדריך הזה מוסבר איך להוסיף לאפליקציה ל-iOS מפת Google עם סמן. הוא מתאים לאנשים עם ידע בסיסי או בינוני ב-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 options = GMSMapViewOptions()
        options.camera = camera
        options.frame = self.view.frame
        let mapView = GMSMapView(options: options)
        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];
  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = camera;
  options.frame = self.view.frame;
  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  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 Package Manager

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

1. מסירים את כל יחסי התלות הקיימים של 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 ומוחקים את ה-podfile.
5. עוברים אל File > Add Package Dependencies (קובץ > הוספת יחסי תלות של חבילות).
6. מזינים את כתובת ה-URL‏ https://github.com/googlemaps/ios-maps-sdk, מקישים על Enter כדי למשוך את החבילה ולוחצים על Add Package.
7. יכול להיות שתצטרכו לאפס את מטמון החבילות דרך File > Packages > Reset Package Cache (קובץ > חבילות > איפוס מטמון החבילות).

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

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

שנתחיל?

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

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

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

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

   import GoogleMaps

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

   GMSServices.provideAPIKey("YOUR_API_KEY")

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

יוצרים ומריצים את האפליקציה

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

פתרון בעיות:

• אם לא מופיעה מפה, צריך לוודא שקיבלתם מפתח API והוספתם אותו לאפליקציה, כפי שמתואר למעלה. בודקים אם יש הודעות שגיאה לגבי מפתח ה-API במסוף ניפוי הבאגים של Xcode.
• אם הגבלתם את מפתח ה-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 options = GMSMapViewOptions()
   options.camera = camera
   let mapView = GMSMapView(options: options)
   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];
   GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
   options.camera = camera;
   GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
   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 של מפות ל-iOS מציג את התוכן של חלון המידע. אם אתם מרוצים מפעולת ברירת המחדל, אין צורך להוסיף רכיב click listener לסמן.

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

השלבים הבאים

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