הסמנים מציינים מיקומים בודדים במפה.
כברירת מחדל, הסמנים משתמשים בסמל סטנדרטי בעל המראה והתחושה הנפוצים של מפות Google. אם אתם רוצים להתאים אישית את הסמן, תוכלו לשנות את הצבע של סמן ברירת המחדל או להחליף את תמונת הסמן בסמל מותאם אישית או לשנות מאפיינים אחרים של הסמן.
בתגובה לאירוע של קליק על סמן, אתם יכולים לפתוח חלון מידע. חלון מידע מציג טקסט או תמונות בחלון של תיבת דו-שיח מעל הסמן. תוכלו להשתמש בחלון מידע שמוגדר כברירת מחדל כדי להציג טקסט, או ליצור חלון מידע מותאם אישית משלכם כדי לשלוט באופן מלא בתוכן שלו.
הוספת סמן
כדי להוסיף סמן, צריך ליצור אובייקט GMSMarker
שכולל את position
ואת title
, ולהגדיר את ה-map
שלו.
הדוגמה הבאה ממחישה איך להוסיף סמן לאובייקט GMSMapView
קיים. הסמן נוצר בקואורדינטות 10,10
, ומציג את המחרוזת 'Hello World' בחלון מידע כשלוחצים עליו.
Swift
let position = CLLocationCoordinate2D(latitude: 10, longitude: 10) let marker = GMSMarker(position: position) marker.title = "Hello World" marker.map = mapView
Objective-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10); GMSMarker *marker = [GMSMarker markerWithPosition:position]; marker.title = @"Hello World"; marker.map = mapView;
אפשר להוסיף אנימציה של סמנים חדשים למפה על ידי הגדרת המאפיין marker.appearAnimation
כך:
kGMSMarkerAnimationPop
כדי לגרום לסמן לבלוט מ-groundAnchor
שלו לאחר ההוספה.kGMSMarkerAnimationFadeIn
כדי לגרום לסמן להתעמעם לאחר ההוספה.
הסרת סמן
אפשר להסיר סמן מהמפה על ידי הגדרת המאפיין map
של GMSMarker
ל-nil
. לחלופין, אפשר להסיר את כל שכבות-העל (כולל סמנים) שמופיעות כרגע במפה, על ידי קריאה ל-method GMSMapView
clear
.
Swift
let camera = GMSCameraPosition.camera( withLatitude: -33.8683, longitude: 151.2086, zoom: 6 ) let mapView = GMSMapView.map(withFrame: .zero, camera: camera) // ... mapView.clear()
Objective-C
GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.8683 longitude:151.2086 zoom:6]; mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera]; // ... [mapView clear];
אם רוצים לבצע שינויים בסמן אחרי שמוסיפים אותו למפה, חשוב להחזיק את האובייקט GMSMarker
. אפשר לשנות את הסמן מאוחר יותר על ידי ביצוע שינויים באובייקט הזה.
Swift
let position = CLLocationCoordinate2D(latitude: 10, longitude: 10) let marker = GMSMarker(position: position) marker.map = mapView // ... marker.map = nil
Objective-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10); GMSMarker *marker = [GMSMarker markerWithPosition:position]; marker.map = mapView; // ... marker.map = nil;
שינוי צבע הסמן
כדי להתאים אישית את הצבע של תמונת הסמן המוגדרת כברירת מחדל, תוכלו לבקש גרסה צבעונית של סמל ברירת המחדל באמצעות markerImageWithColor:
ולהעביר את התמונה שמתקבלת למאפיין הסמל של GMSMarker
.
Swift
marker.icon = GMSMarker.markerImage(with: .black)
Objective-C
marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];
התאמה אישית של תמונת הסמן
אם רוצים לשנות את תמונת ברירת המחדל של הסמן, אפשר להגדיר סמל מותאם אישית באמצעות המאפיין icon
או iconView
של הסמן. אם מגדירים את iconView
, ה-API מתעלם מהמאפיין icon
.
שימוש במאפיין icon
של הסמן
קטע הקוד הבא יוצר סמן עם סמל מותאם אישית שמסופק כ-UIImage
בנכס icon
. הסמל נמצא במרכז לונדון, אנגליה. קטע הקוד מבוסס על ההנחה שהאפליקציה מכילה תמונה בשם 'house.png'.
Swift
let positionLondon = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127) let london = GMSMarker(position: positionLondon) london.title = "London" london.icon = UIImage(named: "house") london.map = mapView
Objective-C
CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127); GMSMarker *london = [GMSMarker markerWithPosition:positionLondon]; london.title = @"London"; london.icon = [UIImage imageNamed:@"house"]; london.map = mapView;
אם יוצרים כמה סמנים עם אותה תמונה, צריך להשתמש באותו מופע של UIImage
לכל אחד מהסמנים. כך אפשר לשפר את ביצועי האפליקציה כשמציגים סמנים רבים.
בתמונה הזו יכולים להיות כמה פריימים. בנוסף, המאפיין alignmentRectInsets
נלקח בחשבון, וזה שימושי אם לסמן יש צל או אזור אחר שלא ניתן לשימוש.
שימוש במאפיין iconView
של הסמן
קטע הקוד הבא יוצר סמן עם סמל מותאם אישית על ידי הגדרת המאפיין iconView
של הסמן, ואנימציה של שינוי בצבע של הסמן.
קטע הקוד מניח שהאפליקציה שלך מכילה תמונה בשם 'house.png'.
Swift
import CoreLocation import GoogleMaps class MarkerViewController: UIViewController, GMSMapViewDelegate { var mapView: GMSMapView! var london: GMSMarker? var londonView: UIImageView? override func viewDidLoad() { super.viewDidLoad() let camera = GMSCameraPosition.camera( withLatitude: 51.5, longitude: -0.127, zoom: 14 ) let mapView = GMSMapView.map(withFrame: .zero, camera: camera) view = mapView mapView.delegate = self let house = UIImage(named: "House")!.withRenderingMode(.alwaysTemplate) let markerView = UIImageView(image: house) markerView.tintColor = .red londonView = markerView let position = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127) let marker = GMSMarker(position: position) marker.title = "London" marker.iconView = markerView marker.tracksViewChanges = true marker.map = mapView london = marker } func mapView(_ mapView: GMSMapView, idleAt position: GMSCameraPosition) { UIView.animate(withDuration: 5.0, animations: { () -> Void in self.londonView?.tintColor = .blue }, completion: {(finished) in // Stop tracking view changes to allow CPU to idle. self.london?.tracksViewChanges = false }) } }
Objective-C
@import CoreLocation; @import GoogleMaps; @interface MarkerViewController : UIViewController <GMSMapViewDelegate> @property (strong, nonatomic) GMSMapView *mapView; @end @implementation MarkerViewController { GMSMarker *_london; UIImageView *_londonView; } - (void)viewDidLoad { [super viewDidLoad]; GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:51.5 longitude:-0.127 zoom:14]; _mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera]; self.view = _mapView; _mapView.delegate = self; UIImage *house = [UIImage imageNamed:@"House"]; house = [house imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate]; _londonView = [[UIImageView alloc] initWithImage:house]; _londonView.tintColor = [UIColor redColor]; CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127); _london = [GMSMarker markerWithPosition:position]; _london.title = @"London"; _london.iconView = _londonView; _london.tracksViewChanges = YES; _london.map = self.mapView; } - (void)mapView:(GMSMapView *)mapView idleAtCameraPosition:(GMSCameraPosition *)position { [UIView animateWithDuration:5.0 animations:^{ self->_londonView.tintColor = [UIColor blueColor]; } completion:^(BOOL finished) { // Stop tracking view changes to allow CPU to idle. self->_london.tracksViewChanges = NO; }]; } @end
מכיוון ש-iconView
מקבל UIView
, יכולה להיות היררכיה של אמצעי בקרה סטנדרטיים בממשק המשתמש שמגדירים את הסמנים שלכם, וכל תצוגה כוללת את הקבוצה הסטנדרטית של יכולות אנימציה. אפשר לכלול שינויים בגודל הסמנים, בצבע וברמות האלפא, וגם להחיל טרנספורמציות שרירותיות. המאפיין iconView
תומך באנימציה של כל התכונות של UIView
שניתנות לאנימציה, מלבד frame
ו-center
.
חשוב להביא בחשבון את הנקודות הבאות כשמשתמשים ב-iconView
:
- הערך
UIView
עלול ליצור ביקוש למשאבים כאשרtracksViewChanges
מוגדר לערךYES
, מה שעלול להוביל לשימוש מוגבר בסוללה. לעומת זאת, פריים אחדUIImage
הוא סטטי ואין צורך לעבד אותו מחדש. - במכשירים מסוימים יכול להיות קשה לעבד את המפה אם יש במסך הרבה סמנים, ולכל סמן יש
UIView
משלו, וכל הסמנים עוקבים אחרי שינויים בו-זמנית. iconView
לא מגיב לאינטראקציה של המשתמש, כי הוא תמונת מצב של התצוגה.- התצוגה פועלת כאילו הערך של
clipsToBounds
מוגדר ל-YES
, ללא קשר לערך בפועל. אפשר להחיל טרנספורמציות שפועלות מחוץ לגבולות, אבל האובייקט שמשרטטים צריך להיות בתוך הגבולות של האובייקט. כל הטרנספורמציות והשינויים מתועדים ומחילים אותם. בקצרה: תצוגות משנה חייבות להיכלל בתוך התצוגה.
כדי להחליט מתי להגדיר את המאפיין tracksViewChanges
, צריך להביא בחשבון את שיקולי הביצועים מול היתרונות של הצגה מחדש של הסמן באופן אוטומטי. למשל:
- אם רוצים לבצע סדרה של שינויים, אפשר לשנות את הנכס ל-
YES
ואז חזרה ל-NO
. - כשאנימציה רצה או שהתוכן נטען באופן אסינכרוני, צריך להשאיר את המאפיין מוגדר ל-
YES
עד שהפעולות הושלמו.
שינוי שקיפות הסמן
אפשר לשלוט בשקיפות של סמן באמצעות המאפיין opacity
שלו. צריך לציין את האטימות כצף בין 0.0 ל-1.0, כאשר 0 הוא שקוף לחלוטין ו-1 הוא אטום לחלוטין.
Swift
marker.opacity = 0.6
Objective-C
marker.opacity = 0.6;
אפשר להנפיש את שקיפות הסמן באמצעות [אנימציה ליבה]אנימציה ליבה באמצעות GMSMarkerLayer
.
מיקום הסמן
בדרך כלל סמלי סמנים מכוונים למסך המכשיר ולא לפני השטח של המפה, כך שסיבוב, הטיה או שינוי מרחק התצוגה של המפה לא בהכרח משנים את כיוון הסמן.
אפשר להגדיר את הכיוון של הסמן כך שיהיה שטוח על פני כדור הארץ. סמנים שטוחים מסתובבים כשהמפה מסובבת, ומשנים את הפרספקטיבה כשמטים את המפה. כמו בסמנים רגילים, סמנים שטוחים שומרים על הגודל שלהם כשמגדילים או מקטינים את המפה.
כדי לשנות את כיוון הסמן, צריך להגדיר את מאפיין flat
של הסמן ל-YES
או ל-true
.
Swift
let positionLondon = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127) let londonMarker = GMSMarker(position: positionLondon) londonMarker.isFlat = true londonMarker.map = mapView
Objective-C
CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127); GMSMarker *londonMarker = [GMSMarker markerWithPosition:positionLondon]; londonMarker.flat = YES; londonMarker.map = mapView;
סיבוב סמן
אפשר לסובב סמן מסביב לנקודת העוגן שלו, על ידי הגדרת המאפיין rotation
. צריך לציין את הסיבוב כסוג CLLocationDegrees
, שנמדד במעלות בכיוון השעון ממיקום ברירת המחדל. כשהסמן שטוח במפה,
מיקום ברירת המחדל הוא צפון.
בדוגמה הבאה מסובב את הסמן ב-90°. אם המאפיין groundAnchor
מוגדר ל-0.5,0.5
, הסמן יסתובב סביב המרכז במקום על הבסיס שלו.
Swift
let degrees = 90.0 londonMarker.groundAnchor = CGPoint(x: 0.5, y: 0.5) londonMarker.rotation = degrees londonMarker.map = mapView
Objective-C
CLLocationDegrees degrees = 90; londonMarker.groundAnchor = CGPointMake(0.5, 0.5); londonMarker.rotation = degrees; londonMarker.map = mapView;
טיפול באירועים בסמנים
ניתן להאזין לאירועים שמתרחשים במפה, למשל כשמשתמש מקיש על סמן. כדי להאזין לאירועים, צריך להטמיע את הפרוטוקול GMSMapViewDelegate
. בקטע אירועים ותנועות של סמנים מוסבר איך לטפל באירועים ספציפיים של סמנים. במדריך לאירועים מופיעה גם רשימה של שיטות ב-GMSMapViewDelegate. לאירועי Street View: GMSPanoramaViewDelegate
.