تشير العلامات إلى مواقع جغرافية فردية على الخريطة.
تستخدم العلامات تلقائيًا رمزًا عاديًا يتوافق مع مظهر "خرائط Google" المعتاد وأسلوبها. إذا أردت تخصيص العلامة، يمكنك تغيير لون العلامة التلقائية أو استبدال صورة العلامة برمز مخصّص أو تغيير سمات العلامة الأخرى.
استجابةً لحدث النقر على علامة، يمكنك فتح 창 معلومات. تعرِض نافذة المعلومات نصًا أو صورًا في مربّع حوار فوق العلامة. يمكنك استخدام نافذة معلومات تلقائية لعرض النص، أو إنشاء نافذة معلومات مخصّصة للتحكّم بشكل كامل في محتواها.
إضافة علامة
لإضافة علامة، أنشئ عنصرًا
GMSMarker
يتضمّن position
وtitle
، واضبط map
.
يوضّح المثال التالي كيفية إضافة علامة إلى عنصر
GMSMapView
حالي. يتم إنشاء العلامة عند الإحداثيات 10,10
، وتعرض
السلسلة "مرحبًا بك" في نافذة معلومات عند النقر عليها.
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
. بدلاً من ذلك، يمكنك إزالة جميع العناصر المتراكبة
(بما في ذلك العلامات) الظاهرة حاليًا على الخريطة من خلال استدعاء الطريقة 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
، تجاهل واجهة برمجة التطبيقات السمة icon
.
استخدام سمة icon
للعلامة
ينشئ المقتطف التالي علامة باستخدام رمز مخصّص مقدَّم كملف
UIImage
في السمة icon
. يقع الرمز في منتصف لندن، إنجلترا. يفترض ال snippet أنّ تطبيقك يحتوي على صورة باسم 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
العادية التي تحدّد العلامات، مع توفّر مجموعة عادية من إمكاناتiconView
للرسوم المتحركة في كل عرض. يمكنك تضمين تغييرات على حجم العلامة ولونها ومستويات التمويه، بالإضافة إلى تطبيق عمليات تحويل عشوائية. يتيح العنصر 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;
يمكنك إضافة تأثيرات متحركة إلى مستوى شفافية العلامة باستخدام Core Animation
باستخدام 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
. اطّلِع على أحداث العلامات
والإيماءات للتعرّف على كيفية التعامل مع
أحداث علامات معيّنة. يوفّر دليل الأحداث أيضًا قائمة methods في GMSMapViewDelegate. للاطّلاع على أحداث "التجوّل الافتراضي"، يُرجى الاطّلاع على
GMSPanoramaViewDelegate
.