المحدِّدات

اختيار النظام الأساسي: Android iOS JavaScript

تشير العلامات إلى مواقع جغرافية فردية على الخريطة.

تستخدِم علامات الموقع الجغرافي تلقائيًا رمزًا عاديًا يتضمّن المظهر العام لـ "خرائط 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. بدلاً من ذلك، يمكنك إزالة جميع التراكبات (بما في ذلك العلامات) المعروضة حاليًا على الخريطة من خلال استدعاء الطريقة 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:، وتمرير الصورة الناتجة إلى السمة icon الخاصة بـ GMSMarker.

Swift

marker.icon = GMSMarker.markerImage(with: .black)
      

Objective-C

marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];
      

تخصيص صورة العلامة

إذا أردت تغيير صورة العلامة التلقائية، يمكنك ضبط رمز مخصّص باستخدام السمة icon أو iconView الخاصة بالعلامة. في حال ضبط iconView، تتجاهل واجهة برمجة التطبيقات السمة 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، بغض النظر عن قيمته الفعلية. يمكنك تطبيق عمليات تحويل تعمل خارج الحدود، ولكن يجب أن يكون العنصر الذي ترسمه ضمن حدود العنصر. تتم مراقبة جميع عمليات التحويل/التغيير وتطبيقها. باختصار، يجب أن تكون العروض الفرعية مضمّنة في العرض.
• لاستخدام -copyWithZone: على GMSMarker، عليك نسخ GMSMarker أولاً، ثم ضبط مثيل جديد من iconView على النسخة. لا تتوافق UIView مع NSCopying، لذا لا يمكنها نسخ iconView.

لتحديد الوقت المناسب لضبط السمة 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. اطّلِع على أحداث العلامات والإيماءات للتعرّف على كيفية التعامل مع أحداث علامات معيّنة. يوفّر دليل الأحداث أيضًا قائمة بطُرق في GMSMapViewDelegate. للاطّلاع على أحداث "التجوّل الافتراضي"، يُرجى الانتقال إلى GMSPanoramaViewDelegate.