ב-SDK של מפות ל-iOS יש כמה דרכים להוסיף צורות למפות. המערכת תומכת בצורות הבאות:
- קו מרובע הוא סדרה של קטעי קו מחוברים שיכולים ליצור כל צורה שרוצים, וניתן להשתמש בהם כדי לסמן נתיבים ומסלולים במפה.
- פוליגון הוא צורה סגורה שאפשר להשתמש בה כדי לסמן אזורים במפה.
- מעגל הוא הקרנה גיאוגרפית מדויקת של מעגל על פני כדור הארץ.
יש כמה דרכים לשנות את המראה של כל צורה.
קווים פוליגונים
קווים פוליגונים מאפשרים לכם לצייר קווים במפה. אובייקט GMSPolyline
מייצג רצף מסודר של מיקומים, שמוצגים כסדרה של קטעי קו. אפשר להגדיר את הצבע של קו פוליגון באמצעות GMSStrokeStyle
.
כדי ליצור קו פוליגון, צריך לציין את הנתיב שלו על ידי יצירת אובייקט GMSMutablePath
תואם עם שתי נקודות או יותר.
כל CLLocationCoordinate2D
מייצג נקודה על פני כדור הארץ. קטעי הקו נמתחים בין הנקודות לפי הסדר שבו מוסיפים אותן לנתיב. אפשר להוסיף נקודות לנתיב באמצעות השיטות addCoordinate:
או addLatitude:longitude:
.
Swift
let path = GMSMutablePath() path.add(CLLocationCoordinate2D(latitude: -33.85, longitude: 151.20)) path.add(CLLocationCoordinate2D(latitude: -33.70, longitude: 151.40)) path.add(CLLocationCoordinate2D(latitude: -33.73, longitude: 151.41)) let polyline = GMSPolyline(path: path)
Objective-C
GMSMutablePath *path = [GMSMutablePath path]; [path addCoordinate:CLLocationCoordinate2DMake(-33.85, 151.20)]; [path addCoordinate:CLLocationCoordinate2DMake(-33.70, 151.40)]; [path addCoordinate:CLLocationCoordinate2DMake(-33.73, 151.41)]; GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
הוספת קו מרובה
- יוצרים אובייקט
GMSMutablePath
. - מגדירים את הנקודות בנתיב באמצעות השיטות
addCoordinate:
אוaddLatitude:longitude:
. - יוצרים אובייקט
GMSPolyline
חדש באמצעות הנתיב כארגומנטים. - מגדירים מאפיינים אחרים, כמו
strokeWidth
ו-strokeColor
, לפי הצורך. - מגדירים את המאפיין
map
שלGMSPolyline
. - הקו הרצוף מופיע במפה.
קטע הקוד הבא מוסיף מלבן למפה:
Swift
let rectanglePath = GMSMutablePath() rectanglePath.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.0)) rectanglePath.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.0)) rectanglePath.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.2)) rectanglePath.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.2)) rectanglePath.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.0)) let rectangle = GMSPolyline(path: path) rectangle.map = mapView
Objective-C
GMSMutablePath *rectanglePath = [GMSMutablePath path]; [rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.36, -122.0)]; [rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.45, -122.0)]; [rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.45, -122.2)]; [rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.36, -122.2)]; [rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.36, -122.0)]; GMSPolyline *rectangle = [GMSPolyline polylineWithPath:path]; rectangle.map = mapView;
הסרת קו מרובה
כדי להסיר קו פוליגון מהמפה, מגדירים את המאפיין map
של GMSPolyline
לערך nil
. לחלופין, אפשר להסיר את כל השכבות (כולל קווים פוליגונליים וצורות אחרות) במפה על ידי קריאה ל-method GMSMapView
clear
.
Swift
mapView.clear()
Objective-C
[mapView clear];
התאמה אישית של קו פוליגוני
באובייקט GMSPolyline
יש כמה מאפיינים שאפשר להשתמש בהם כדי לקבוע את המראה של הקו. הוא תומך באפשרויות הבאות:
strokeWidth
- רוחב הקו כולו, בנקודות מסך. ברירת המחדל היא 1. רוחב התמונה לא משתנה כשמשנים את מרחק התצוגה במפה.
geodesic
-
כשהערך הוא
YES
, המערכת תיצור עיבוד גרפי של הקצה הזה של קו הפוליגון כקו גיאודטי. קטעים גיאודזיים עוקבים אחרי הנתיב הקצר ביותר על פני כדור הארץ, ויכול להיות שיופיעו כקווים מעוקלים במפה עם הקרנה של Mercator. קטעים לא גיאודיסיים מוצגים במפה כקווים ישרים. ברירת המחדל היאNO
. spans
- משמש לציון הצבע של מקטע אחד או יותר של קו פוליגון. המאפיין spans הוא מערך של אובייקטים מסוג
GMSStyleSpan
. הגדרת המאפייןspans
היא הדרך המועדפת לשינוי הצבע של קו פוליגון. strokeColor
- אובייקט
UIColor
שמציין את הצבע של קו הפוליגון. ברירת המחדל היאblueColor
. המערכת מתעלמת מהמאפייןstrokeColor
אם המאפייןspans
מוגדר.
קטע הקוד הבא מוסיף קו פוליגון עבה ממלבורן לפרת', עם אינטרפולציה גיאודזית.
Swift
let path = GMSMutablePath() path.addLatitude(-37.81319, longitude: 144.96298) path.addLatitude(-31.95285, longitude: 115.85734) let polyline = GMSPolyline(path: path) polyline.strokeWidth = 10.0 polyline.geodesic = true polyline.map = mapView
Objective-C
GMSMutablePath *path = [GMSMutablePath path]; [path addLatitude:-37.81319 longitude:144.96298]; [path addLatitude:-31.95285 longitude:115.85734]; GMSPolyline *polyline = [GMSPolyline polylineWithPath:path]; polyline.strokeWidth = 10.f; polyline.geodesic = YES; polyline.map = mapView;
כדי לשנות קו פוליגון אחרי שהוא נוסף למפה, צריך להקפיד להחזיק את האובייקט GMSPolyline
.
Swift
polyline.strokeColor = .blue
Objective-C
polyline.strokeColor = [UIColor blueColor];
שינוי הצבע של קו מרובע
קווים פוליגונים מוצגים במפה כסדרה של קטעים. אפשר לשנות את הצבע של קטעים ספציפיים או של כל השורה באמצעות הנכס spans
. המאפיין הזה מאפשר לכם לשלוט באופן מפורט בצבע של קו פוליגון, אבל יש כמה דרכים נוחות להחיל סגנון אחד על כל הקו.
קטע הקוד הבא משתמש בשיטה spanWithColor:
כדי לשנות את הצבע של כל הקו לאדום.
Swift
polyline.spans = [GMSStyleSpan(color: .red)]
Objective-C
polyline.spans = @[[GMSStyleSpan spanWithColor:[UIColor redColor]]];
לחלופין, אם כבר יש לכם גישה לאובייקט GMSStrokeStyle
, תוכלו להשתמש בשיטה spanWithStyle:
.
Swift
let solidRed = GMSStrokeStyle.solidColor(.red) polyline.spans = [GMSStyleSpan(style: solidRed)]
Objective-C
GMSStrokeStyle *solidRed = [GMSStrokeStyle solidColor:[UIColor redColor]]; polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed]];
לפני גרסה 1.7 של SDK של מפות ל-iOS, אפשר היה להשתמש במאפיין היחיד strokeColor
כדי להגדיר את כל הצבע של GMSPolyline
. המאפיין spans
מקבל עדיפות על פני strokeColor
.
Swift
polyline.strokeColor = .red
Objective-C
polyline.strokeColor = [UIColor redColor];
סגנונות
אם באפליקציה שלכם נעשה שימוש באותו צבע קו כמה פעמים, כדאי להגדיר סגנון לשימוש חוזר. סגנונות של קווים פוליגונים מצוינים באמצעות האובייקט GMSStrokeStyle
. סגנון הקו יכול להיות צבע אחיד או שינוי הדרגתי מצבע אחד לצבע אחר. אחרי שיוצרים סגנון, אפשר להחיל אותו על GMSStyleSpan
באמצעות השיטה spanWithStyle:
.
Swift
// Create two styles: one that is solid blue, and one that is a gradient from red to yellow let solidBlue = GMSStrokeStyle.solidColor(.blue) let solidBlueSpan = GMSStyleSpan(style: solidBlue) let redYellow = GMSStrokeStyle.gradient(from: .red, to: .yellow) let redYellowSpan = GMSStyleSpan(style: redYellow)
Objective-C
// Create two styles: one that is solid blue, and one that is a gradient from red to yellow GMSStrokeStyle *solidBlue = [GMSStrokeStyle solidColor:[UIColor blueColor]]; GMSStyleSpan *solidBlueSpan = [GMSStyleSpan spanWithStyle:solidBlue]; GMSStrokeStyle *redYellow = [GMSStrokeStyle gradientFromColor:[UIColor redColor] toColor:[UIColor yellowColor]]; GMSStyleSpan *redYellowSpan = [GMSStyleSpan spanWithStyle:redYellow];
הסגנון של span
יימשך עד סוף הקו הפוליגוני, או עד שתגדירו סגנון חדש. כדי לשנות את הצבע של הקו כולו, מגדירים את המאפיין spans
של קו פוליגון ל-GMSStyleSpan
אחד. בדוגמה הזו מוסבר איך מחילים שינוי הדרגתי לאורך כל הקו.
Swift
polyline.spans = [GMSStyleSpan(style: redYellow)]
Objective-C
polyline.spans = @[[GMSStyleSpan spanWithStyle:redYellow]];
שינוי הצבע של קטעי קו ספציפיים
אם רוצים להגדיר עיצוב לכל מקטע בנפרד, אפשר ליצור מערך של אובייקטים מסוג GMSStyleSpan
ולהעביר אותו לנכס spans
. כברירת מחדל, כל פריט במערך מגדיר את הצבע של מקטע הקו המתאים. אם יש יותר רכיבים במערך מאשר פלחים בשורה, המערכת תתעלם מהרכיבים הנוספים. אם יש פחות רכיבים במערך, הערך של GMSStyleSpan
האחרון מתאר את הצבע של שאר השורה.
אפשר להשתמש בקטעי צבע ו/או בקו פוליגון עם שיפוע כדי לציין שינויים לאורך קו הפוליגון, כמו גובה או מהירות. קטע הקוד הבא מגדיר את הצבע של שני הקטעים הראשונים של קו פוליגון לאדום, והשאר של הקו הוא שיפוע מאדום לצהוב.
Swift
polyline.spans = [ GMSStyleSpan(style: solidRed), GMSStyleSpan(style: solidRed), GMSStyleSpan(style: redYellow) ]
Objective-C
polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed], [GMSStyleSpan spanWithStyle:solidRed], [GMSStyleSpan spanWithStyle:redYellow]];
אפשר להשתמש בשיטה spanWithStyle:segments:
כדי להגדיר את הסגנון לכמה פלחים בו-זמנית. לדוגמה, הקוד הבא שווה ערך לקוד שלמעלה.
תמיד מתעלמים מאורך הקטע של GMSStyleSpan
הסופי, כי הסגנון משמש לתיאור שאר השורה.
Swift
polyline.spans = [ GMSStyleSpan(style: solidRed, segments:2), GMSStyleSpan(style: redYellow, segments:10) ]
Objective-C
polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed segments:2], [GMSStyleSpan spanWithStyle:redYellow segments:10]];
פלחים חלקיים
אפשר גם לציין פלחים כערך שבר. כך הסטייל יחול על מספר הפלחים החלקיוני, ויכול להיות שיגרום לפיצול של פלח אחד. כל GMSStyleSpan
מתחיל מיד אחרי הקודם: בדוגמה הבאה, הצבע האפור מתחיל מ-½ הקטע השני וממשיך עד ½ הקטע השלישי.
Swift
polyline.spans = [ GMSStyleSpan(style: solidRed, segments: 2.5), GMSStyleSpan(color: .gray), GMSStyleSpan(color: .purple, segments: 0.75), GMSStyleSpan(style: redYellow) ]
Objective-C
polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed segments:2.5], [GMSStyleSpan spanWithColor:[UIColor grayColor]], [GMSStyleSpan spanWithColor:[UIColor purpleColor] segments:0.75], [GMSStyleSpan spanWithStyle:redYellow]];
הוספת דפוס צבע חוזר לקו מרובה
כדי להוסיף דפוס לקו פוליגון, אפשר להשתמש בשיטת השירות GMSStyleSpans
ב-GMSGeometryUtils
. השיטה GMSStyleSpans
מקבלת שני מערכי נתונים שמגדירים דפוס חוזר. במערך אחד מגדירים את הסגנונות שצריך לחזור עליהם, ובמערך השני מגדירים את מרווח החזרה. כשמשתמשים בהם יחד, אפשר ליצור דפוס שאפשר להחיל על כל קו פוליגון, ללא קשר לאורכו או למספר הקטעים הזמינים.
לדוגמה, קטע הקוד הבא מגדיר קו פוליגון עם דפוס שחור-לבן לסירוגין. האורך שלהם מחושב במטרים לאורך קו רוחב (ב-Mercator, זהו קו ישר) כי הסוג שצוין הוא kGMSLengthRhumb
.
Swift
let styles = [ GMSStrokeStyle.solidColor(.white), GMSStrokeStyle.solidColor(.black) ] let lengths: [NSNumber] = [100000, 50000] polyline.spans = GMSStyleSpans( polyline.path!, styles, lengths, GMSLengthKind.rhumb )
Objective-C
NSArray *styles = @[[GMSStrokeStyle solidColor:[UIColor whiteColor]], [GMSStrokeStyle solidColor:[UIColor blackColor]]]; NSArray *lengths = @[@100000, @50000]; polyline.spans = GMSStyleSpans(polyline.path, styles, lengths, kGMSLengthRhumb);
קווים פוליגונים עם חותמת של Sprite
קווים פוליגונים עם חותמת של ספרייט מאפשרים ליצור קו פוליגון באמצעות תמונה חוזרת של בייטמאפ לבחירתכם. הצורות מוצגות עם קו רקע ברור, אבל החותמת לא חתוכה בפינות הקווים – כך שהן שימושיות במצבים כמו נקודות להמחשת מסלולי הליכה.
אפשר להשתמש בתכונה הזו באמצעות GMSSpriteStyle
ולהגדיר אותה כחותמת באמצעות המאפיין stampStyle
של GMSStrokeStyle
.
Swift
let path = GMSMutablePath() path.addLatitude(-37.81319, longitude: 144.96298) path.addLatitude(-31.95285, longitude: 115.85734) let polyline = GMSPolyline(path: path) polyline.strokeWidth = 20 let image = UIImage(named: "imageFromBundleOrAsset")! // Image could be from anywhere let stampStyle = GMSSpriteStyle(image: image) let transparentStampStroke = GMSStrokeStyle.transparentStroke(withStamp: stampStyle) let span = GMSStyleSpan(style: transparentStampStroke) polyline.spans = [span] polyline.map = mapView
Objective-C
GMSMutablePath *path = [GMSMutablePath path]; [path addLatitude:-37.81319 longitude:144.96298]; [path addLatitude:-31.95285 longitude:115.85734]; polyline.strokeWidth = 20; GMSPolyline *polyline = [GMSPolyline polylineWithPath:path]; UIImage *image = [UIImage imageNamed:@"imageFromBundleOrAsset"]; GMSStrokeStyle *transparentStampStroke = [GMSStrokeStyle transparentStrokeWithStampStyle:[GMSSpriteStyle spriteStyleWithImage:image]]; GMSStyleSpan *span = [GMSStyleSpan spanWithStyle:transparentStampStroke]; polyline.spans = @[span]; polyline.map = _mapView;
קווים פוליגונים עם חותמת מרקם
קווים פוליגונים עם חותמת של טקסטורה מאפשרים ליצור קו פוליגון באמצעות טקסטורה חוזרת לבחירתכם. אפשר להציג צורות עם קו רקע שקוף, צבע אחיד או שיפוע. גודל המרקם משתנה כשרמות הזום משתנות. תמונות בסוף או בהתחלה של נתיבים או של נקודות בנתיב חתוכות ברמות מסוימות של הגדלת התצוגה.
אפשר להשתמש בתכונה הזו באמצעות GMSTextureStyle
ולהגדיר אותה כחותמת באמצעות המאפיין stampStyle
של GMSStrokeStyle
.
Swift
let path = GMSMutablePath() path.addLatitude(-37.81319, longitude: 144.96298) path.addLatitude(-31.95285, longitude: 115.85734) let polyline = GMSPolyline(path: path) polyline.strokeWidth = 20 let redWithStamp = GMSStrokeStyle.solidColor(.red) let image = UIImage(named: "imageFromBundleOrAsset")! // Image could be from anywhere redWithStamp.stampStyle = GMSTextureStyle(image: image) let span = GMSStyleSpan(style: redWithStamp) polyline.spans = [span] polyline.map = mapView
Objective-C
GMSMutablePath *path = [GMSMutablePath path]; [path addLatitude:-37.81319 longitude:144.96298]; [path addLatitude:-31.95285 longitude:115.85734]; GMSPolyline *polyline = [GMSPolyline polylineWithPath:path]; polyline.strokeWidth = 20; GMSStrokeStyle *redWithStamp = [GMSStrokeStyle solidColor:[UIColor redColor]]; UIImage *image = [UIImage imageNamed:@"imageFromBundleOrAsset"]; // Image could be from anywhere redWithStamp.stampStyle = [GMSTextureStyle textureStyleWithImage:image]; GMSStyleSpan *span = [GMSStyleSpan spanWithStyle:redWithStamp]; polyline.spans = @[span]; polyline.map = _mapView;
יכולות המפה
המאפיין mapCapabilities
ב-GMSMapView
מוסיף בדיקה פרוגרמטית של תכונות ספציפיות למפה. האפשרות הזו שימושית אם רוצים לדעת אם capabilities
מסוימים של מפה זמינים לפני שמפעילים ממשקי API ספציפיים. השאילתה הזו קובעת אם תצוגת המפה תומכת בקוים פוליגונים עם חותמת של Sprite.
Swift
let path = GMSMutablePath() path.addLatitude(-37.81319, longitude: 144.96298) path.addLatitude(-31.95285, longitude: 115.85734) let polyline = GMSPolyline(path: path) polyline.strokeWidth = 20 let image = UIImage(named: "imageFromBundleOrAsset")! // Image could be from anywhere let spans: [GMSStyleSpan] if (mapView.mapCapabilities.contains(.spritePolylines)) { let spriteStyle = GMSSpriteStyle(image: image) let stroke = GMSStrokeStyle.transparentStroke(withStamp: spriteStyle) spans = [ GMSStyleSpan(style: stroke) ] } else { let stroke = GMSStrokeStyle.solidColor(.clear) stroke.stampStyle = GMSTextureStyle(image: image) spans = [ GMSStyleSpan(style: stroke) ] } polyline.spans = spans polyline.map = mapView
Objective-C
GMSMutablePath *path = [GMSMutablePath path]; [path addLatitude:-37.81319 longitude:144.96298]; [path addLatitude:-31.95285 longitude:115.85734]; UIImage *_Nonnull image = [UIImage imageNamed:@"imageFromBundleOrAsset"]; // Image could be from anywhere NSArray<GMSStyleSpan *> * spans; if (_mapView.mapCapabilities & GMSMapCapabilityFlagsSpritePolylines) { GMSSpriteStyle *spriteStyle = [GMSSpriteStyle spriteStyleWithImage:image]; GMSStrokeStyle *stroke = [GMSStrokeStyle transparentStrokeWithStampStyle:spriteStyle]; spans = @[ [GMSStyleSpan spanWithStyle:stroke] ]; } else { GMSStrokeStyle *stroke = [GMSStrokeStyle solidColor:UIColor.clearColor]; stroke.stampStyle = [GMSTextureStyle textureStyleWithImage:image]; spans = @[ [GMSStyleSpan spanWithStyle:stroke] ]; } GMSPolyline *polyline = [GMSPolyline polylineWithPath:path]; polyline.strokeWidth = 20; polyline.spans = spans; polyline.map = _mapView;
התבנית הזו מאפשרת לכם להירשם לשינויים ולהגיב לעדכונים באמצעות מצב תצוגת המפה. אפשר גם להטמיע את didChangeMapCapabilities
ב-GMSMapViewDelegate
כדי לקבל עדכונים לגבי זמינות התכונות.
פוליגונים
פוליגונים דומים לקווים פוליגונים בכך שהם מורכבים מסדרה של קואורדינטות ברצף מסודר. עם זאת, במקום להיות פתוחים, פוליגונים נועדו להגדיר אזורים מוצקים בתוך לולאה סגורה. הפוליגונים מוגדרים ב-SDK של מפות ל-iOS באמצעות הכיתה GMSPolygon
.
אפשר להוסיף GMSPolygon
למפה באותו אופן שבו מוסיפים GMSPolyline
. קודם כול, צריך לציין את הנתיב שלו על ידי יצירת אובייקט GMSMutablePath
תואם והוספת נקודות אליו.
הנקודות האלה יוצרות את קווי המתאר של הפוליגון. כל CLLocationCoordinate2D
מייצג נקודה על פני כדור הארץ. קטעי הקו נמתחים בין הנקודות לפי הסדר שבו מוסיפים אותם לנתיב.
הוספת מצולע
- יוצרים אובייקט
GMSMutablePath
. - מגדירים את הנקודות בנתיב באמצעות השיטות
addCoordinate:
אוaddLatitude:longitude:
. הנקודות האלה יוצרות את קווי המתאר של הפוליגון. - יוצרים אובייקט
GMSPolygon
חדש באמצעות הנתיב כארגומנטים. - מגדירים מאפיינים אחרים, כמו
strokeWidth
, strokeColor
ו-fillColor
, לפי הצורך. - מקצים את הפוליגון לאובייקט
GMSMapView
על ידי הגדרת המאפייןGMSPolygon.map
. - הפוליגון יופיע במפה.
קטע הקוד הבא מוסיף מלבן למפה.
Swift
// Create a rectangular path let rect = GMSMutablePath() rect.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.0)) rect.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.0)) rect.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.2)) rect.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.2)) // Create the polygon, and assign it to the map. let polygon = GMSPolygon(path: rect) polygon.fillColor = UIColor(red: 0.25, green: 0, blue: 0, alpha: 0.05); polygon.strokeColor = .black polygon.strokeWidth = 2 polygon.map = mapView
Objective-C
// Create a rectangular path GMSMutablePath *rect = [GMSMutablePath path]; [rect addCoordinate:CLLocationCoordinate2DMake(37.36, -122.0)]; [rect addCoordinate:CLLocationCoordinate2DMake(37.45, -122.0)]; [rect addCoordinate:CLLocationCoordinate2DMake(37.45, -122.2)]; [rect addCoordinate:CLLocationCoordinate2DMake(37.36, -122.2)]; // Create the polygon, and assign it to the map. GMSPolygon *polygon = [GMSPolygon polygonWithPath:rect]; polygon.fillColor = [UIColor colorWithRed:0.25 green:0 blue:0 alpha:0.05]; polygon.strokeColor = [UIColor blackColor]; polygon.strokeWidth = 2; polygon.map = mapView;
אפשר להתאים אישית את המראה של הפוליגון גם לפני שמוסיפים אותו למפה וגם אחרי שמוסיפים אותו למפה.
הסרת פוליגון
כדי להסיר פוליגון, מגדירים את המאפיין GMSPolygon.map
לערך nil
ומנתקים את layer
מהורה שלו.
Swift
polygon.map = nil polygon.layer.removeFromSuperLayer()
Objective-C
polygon.map = nil; [polygon.layer removeFromSuperlayer];
מעגלים
בנוסף למחלקה הגנרית GMSPolygon
, ה-SDK של מפות ל-iOS כולל גם את GMSCircle
, שמאפשרת לצייר עיגולים על פני כדור הארץ.
כדי ליצור עיגול, צריך לציין את שני המאפיינים הבאים:
position
כ-CLLocationCoordinate2D
.radius
במטרים.
לאחר מכן, מעגל מוגדר כקבוצה של כל הנקודות על פני כדור הארץ שנמצאות במרחק radius
מטרים מנקודת center
הנתונה. בגלל אופן ההצגה של תרשים מרקטור (Mercator) שמשמש את Maps API להצגת כדור על משטח שטוח, הוא מופיע כמעגל כמעט מושלם במפה כשהוא ממוקם ליד קו המשווה, והוא נראה פחות עגול (במסך) ככל שהוא מתרחק מקו המשווה.
הוספת מעגל
קטע הקוד הבא מוסיף עיגול למפה:
Swift
let circleCenter = CLLocationCoordinate2D(latitude: 37.35, longitude: -122.0) let circle = GMSCircle(position: circleCenter, radius: 1000) circle.map = mapView
Objective-C
CLLocationCoordinate2D circleCenter = CLLocationCoordinate2DMake(37.35, -122.0); GMSCircle *circle = [GMSCircle circleWithPosition:circleCenter radius:1000]; circle.map = mapView;
אפשר להתאים אישית את המראה של העיגול גם לפני שמוסיפים אותו למפה וגם אחרי שמוסיפים אותו למפה.
התאמה אישית של מעגל
כדי לציין צבעים ורוחבי קווים מותאמים אישית, משנים את המאפיינים של GMSCircle
. הוא תומך באפשרויות הבאות:
fillColor
- אובייקט
UIColor
שמציין את הצבע הפנימי של העיגול. ברירת המחדל היא שקיפות. strokeColor
- אובייקט
UIColor
שמציין את הצבע של קווי המתאר של המעגל. ברירת המחדל היאblackColor
. strokeWidth
- העובי של קווי המתאר של העיגול, בנקודות מסך. ברירת המחדל היא 1. העובי לא משתנה כשמשנים את מרחק התצוגה במפה.
קטע הקוד הבא מוסיף עיגול אדום עבה עם שטח פנימי אדום שקוף למחצה.
Swift
circle.fillColor = UIColor(red: 0.35, green: 0, blue: 0, alpha: 0.05) circle.strokeColor = .red circle.strokeWidth = 5
Objective-C
circle.fillColor = [UIColor colorWithRed:0.25 green:0 blue:0 alpha:0.05]; circle.strokeColor = [UIColor redColor]; circle.strokeWidth = 5;
יצירת פוליגון חלול
אפשר לשלב כמה נתיבים באובייקט GMSPolygon
אחד כדי ליצור צורות מורכבות, כמו טבעות מלאות או סופגניות (שבהן אזורים פוליגוניים מופיעים בתוך הפוליגון כצורות נפרדות). צורות מורכבות הן קומפוזיציה של כמה נתיבים.
יוצרים פוליגון עם נתיב שמציין את האזור הגדול ביותר שמכוסה על ידי הפוליגון. לאחר מכן מציינים את המאפיין holes
של הפוליגון כמערך של אובייקט GMSPath
אחד או יותר, שמגדירים את החורים בתוך הפוליגון.
אם נתיב קטן יותר מוקף לגמרי על ידי הנתיב הגדול יותר, נראה כאילו חלק מהפוליגון הוסר.
בקוד לדוגמה הבא נוצר פוליגון עם שני חורים:
Swift
let hydeParkLocation = CLLocationCoordinate2D(latitude: -33.87344, longitude: 151.21135) let camera = GMSCameraPosition.camera(withTarget: hydeParkLocation, zoom: 16) let mapView = GMSMapView.map(withFrame: .zero, camera: camera) mapView.animate(to: camera) let hydePark = "tpwmEkd|y[QVe@Pk@BsHe@mGc@iNaAKMaBIYIq@qAMo@Eo@@[Fe@DoALu@HUb@c@XUZS^ELGxOhAd@@ZB`@J^BhFRlBN\\BZ@`AFrATAJAR?rAE\\C~BIpD" let archibaldFountain = "tlvmEqq|y[NNCXSJQOB[TI" let reflectionPool = "bewmEwk|y[Dm@zAPEj@{AO" let hollowPolygon = GMSPolygon() hollowPolygon.path = GMSPath(fromEncodedPath: hydePark) hollowPolygon.holes = [GMSPath(fromEncodedPath: archibaldFountain)!, GMSPath(fromEncodedPath: reflectionPool)!] hollowPolygon.fillColor = UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 0.2) hollowPolygon.strokeColor = UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 1.0) hollowPolygon.strokeWidth = 2 hollowPolygon.map = mapView
Objective-C
CLLocationCoordinate2D hydeParkLocation = CLLocationCoordinate2DMake(-33.87344, 151.21135); GMSCameraPosition *camera = [GMSCameraPosition cameraWithTarget:hydeParkLocation zoom:16]; mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera]; NSString *hydePark = @"tpwmEkd|y[QVe@Pk@BsHe@mGc@iNaAKMaBIYIq@qAMo@Eo@@[Fe@DoALu@HUb@c@XUZS^ELGxOhAd@@ZB`@J^BhFRlBN\\BZ@`AFrATAJAR?rAE\\C~BIpD"; NSString *archibaldFountain = @"tlvmEqq|y[NNCXSJQOB[TI"; NSString *reflectionPool = @"bewmEwk|y[Dm@zAPEj@{AO"; GMSPolygon *hollowPolygon = [[GMSPolygon alloc] init]; hollowPolygon.path = [GMSPath pathFromEncodedPath:hydePark]; hollowPolygon.holes = @[[GMSPath pathFromEncodedPath:archibaldFountain], [GMSPath pathFromEncodedPath:reflectionPool]]; hollowPolygon.fillColor = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:0.2]; hollowPolygon.strokeColor = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:1.0]; hollowPolygon.strokeWidth = 2; hollowPolygon.map = mapView;