চিহ্নিতকারী

প্ল্যাটফর্ম নির্বাচন করুন: অ্যান্ড্রয়েড আইওএস জাভাস্ক্রিপ্ট

চিহ্নিতকারীগুলো মানচিত্রে একক অবস্থান নির্দেশ করে।

ডিফল্টরূপে, মার্কারগুলো একটি সাধারণ আইকন ব্যবহার করে, যার চেহারা ও গঠন গুগল ম্যাপসের মতোই। আপনি যদি আপনার মার্কারটি কাস্টমাইজ করতে চান, তাহলে ডিফল্ট মার্কারটির রঙ পরিবর্তন করতে পারেন, অথবা মার্কারের ছবিটি একটি কাস্টম আইকন দিয়ে প্রতিস্থাপন করতে পারেন, কিংবা মার্কারটির অন্যান্য বৈশিষ্ট্য পরিবর্তন করতে পারেন।

কোনো মার্কারে ক্লিক ইভেন্টের প্রতিক্রিয়ায়, আপনি একটি তথ্য উইন্ডো খুলতে পারেন। তথ্য উইন্ডোটি মার্কারের উপরে একটি ডায়ালগ উইন্ডোতে লেখা বা ছবি প্রদর্শন করে। আপনি লেখা দেখানোর জন্য একটি ডিফল্ট তথ্য উইন্ডো ব্যবহার করতে পারেন, অথবা এর বিষয়বস্তু সম্পূর্ণরূপে নিয়ন্ত্রণ করতে আপনার নিজস্ব কাস্টম তথ্য উইন্ডো তৈরি করতে পারেন।

একটি মার্কার যোগ করা

একটি মার্কার যোগ করতে, একটি GMSMarker অবজেক্ট তৈরি করুন যাতে একটি position ও title অন্তর্ভুক্ত থাকে এবং এর map সেট করুন।

নিম্নলিখিত উদাহরণটি দেখায় কিভাবে একটি বিদ্যমান GMSMapView অবজেক্টে একটি মার্কার যুক্ত করতে হয়। মার্কারটি 10,10 স্থানাঙ্কে তৈরি করা হয় এবং ক্লিক করা হলে একটি তথ্য উইন্ডোতে "Hello world" স্ট্রিংটি প্রদর্শন করে।

সুইফট 

let position = CLLocationCoordinate2D(latitude: 10, longitude: 10)
let marker = GMSMarker(position: position)
marker.title = "Hello World"
marker.map = mapView

উদ্দেশ্য-সি 

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10);
GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.title = @"Hello World";
marker.map = mapView;

ম্যাপে নতুন মার্কার যুক্ত হওয়ার প্রক্রিয়াটিকে অ্যানিমেট করতে, marker.appearAnimation প্রপার্টিটি নিম্নরূপে সেট করুন:

  • kGMSMarkerAnimationPop যোগ করা হলে মার্কারটি তার groundAnchor থেকে বেরিয়ে আসে।
  • kGMSMarkerAnimationFadeIn যোগ করা হলে মার্কারটি ধীরে ধীরে দৃশ্যমান হয়।

একটি মার্কার সরানো

আপনি GMSMarker এর map প্রপার্টিকে nil এ সেট করে ম্যাপ থেকে একটি মার্কার মুছে ফেলতে পারেন। বিকল্পভাবে, আপনি GMSMapView এর clear মেথডটি কল করে ম্যাপে বর্তমানে থাকা সমস্ত ওভারলে (মার্কার সহ) মুছে ফেলতে পারেন।

সুইফট 

let camera = GMSCameraPosition.camera(
  withLatitude: -33.8683,
  longitude: 151.2086,
  zoom: 6
)
let mapView = GMSMapView.map(withFrame: .zero, camera: camera)
// ...
mapView.clear()

উদ্দেশ্য-সি 

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:6];
mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
// ...
[mapView clear];

মানচিত্রে কোনো মার্কার যুক্ত করার পর যদি আপনি সেটিতে কোনো পরিবর্তন করতে চান, তাহলে GMSMarker অবজেক্টটি অবশ্যই সংরক্ষণ করুন। পরবর্তীতে এই অবজেক্টটিতে পরিবর্তন করে আপনি মার্কারটি সংশোধন করতে পারবেন।

সুইফট 

let position = CLLocationCoordinate2D(latitude: 10, longitude: 10)
let marker = GMSMarker(position: position)
marker.map = mapView
// ...
marker.map = nil

উদ্দেশ্য-সি 

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10);
GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.map = mapView;
// ...
marker.map = nil;

মার্কারের রঙ পরিবর্তন করা

আপনি markerImageWithColor: ব্যবহার করে ডিফল্ট আইকনের একটি রঙিন সংস্করণ অনুরোধ করে এবং ফলস্বরূপ প্রাপ্ত ছবিটি GMSMarker এর icon প্রপার্টিতে পাস করে ডিফল্ট মার্কার ছবির রঙ কাস্টমাইজ করতে পারেন।

সুইফট 

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

উদ্দেশ্য-সি 

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

মার্কার ইমেজ কাস্টমাইজ করা

আপনি যদি ডিফল্ট মার্কার ইমেজটি পরিবর্তন করতে চান, তাহলে মার্কারের ' icon অথবা iconView প্রপার্টি ব্যবহার করে একটি কাস্টম আইকন সেট করতে পারেন। যদি iconView সেট করা থাকে, তাহলে API ' icon প্রপার্টিটিকে উপেক্ষা করে।

মার্কারের icon বৈশিষ্ট্য ব্যবহার করে

নিম্নলিখিত কোড স্নিপেটটি ' icon প্রপার্টিতে UIImage হিসেবে প্রদত্ত একটি কাস্টম আইকন সহ একটি মার্কার তৈরি করে। আইকনটি ইংল্যান্ডের লন্ডনে কেন্দ্র করে স্থাপন করা হয়েছে। এই স্নিপেটটি ধরে নেয় যে আপনার অ্যাপ্লিকেশনে 'house.png' নামের একটি ছবি রয়েছে।

সুইফট 

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

উদ্দেশ্য-সি 

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" নামের একটি ছবি রয়েছে।

সুইফট 

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
    })
  }
}

উদ্দেশ্য-সি 

@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 গ্রহণ করে, তাই আপনি আপনার মার্কারগুলো নির্ধারণ করার জন্য সাধারণ UI কন্ট্রোলগুলোর একটি স্তরক্রম তৈরি করতে পারেন, যেখানে প্রতিটি ভিউয়েরই অ্যানিমেশনের জন্য সাধারণ সুবিধাগুলো থাকে। আপনি মার্কারের আকার, রঙ এবং আলফা লেভেলে পরিবর্তন আনার পাশাপাশি যেকোনো ধরনের রূপান্তরও প্রয়োগ করতে পারেন। iconView প্রপার্টিটি UIView এর frame এবং center ছাড়া বাকি সব অ্যানিমেটযোগ্য প্রপার্টির অ্যানিমেশন সমর্থন করে।

iconView ব্যবহার করার সময় নিম্নলিখিত বিষয়গুলো অনুগ্রহ করে মনে রাখবেন:

  • যখন tracksViewChanges YES এ সেট করা থাকে, তখন UIView রিসোর্সের উপর চাপ সৃষ্টি করতে পারে, যার ফলে ব্যাটারির ব্যবহার বেড়ে যেতে পারে। এর তুলনায়, একটি একক ফ্রেমের UIImage স্থির থাকে এবং এটিকে পুনরায় রেন্ডার করার প্রয়োজন হয় না।
  • স্ক্রিনে অনেকগুলো মার্কার থাকলে, প্রতিটি মার্কারের নিজস্ব UIView থাকলে এবং সবগুলো মার্কার একই সময়ে পরিবর্তন ট্র্যাক করলে, কিছু ডিভাইসের পক্ষে ম্যাপটি রেন্ডার করা কঠিন হতে পারে।
  • iconView ব্যবহারকারীর ইন্টারঅ্যাকশনে সাড়া দেয় না, কারণ এটি ভিউটির একটি স্ন্যাপশট।
  • এর প্রকৃত মান যাই হোক না কেন, ভিউটি এমনভাবে কাজ করে যেন clipsToBounds মান YES সেট করা আছে। আপনি সীমার বাইরে কাজ করে এমন ট্রান্সফর্ম প্রয়োগ করতে পারেন, কিন্তু আপনি যে অবজেক্টটি আঁকবেন তা অবশ্যই মূল অবজেক্টের সীমার মধ্যে থাকতে হবে। সমস্ত ট্রান্সফর্ম/শিফট পর্যবেক্ষণ ও প্রয়োগ করা হয়। সংক্ষেপে: সাবভিউ অবশ্যই ভিউটির মধ্যে থাকতে হবে।
  • GMSMarker এ -copyWithZone: ব্যবহার করতে হলে, আপনাকে প্রথমে GMSMarker টি কপি করতে হবে এবং তারপর সেই কপির উপর iconView এর একটি নতুন ইনস্ট্যান্স সেট করতে হবে। UIView NSCopying সমর্থন করে না, তাই এটি iconView কপি করতে পারে না।

tracksViewChanges প্রপার্টিটি কখন সেট করবেন তা সিদ্ধান্ত নিতে, মার্কারটি স্বয়ংক্রিয়ভাবে পুনরায় আঁকার সুবিধার বিপরীতে পারফরম্যান্সের বিষয়গুলো বিবেচনা করা উচিত। উদাহরণস্বরূপ:

  • যদি আপনাকে ধারাবাহিকভাবে একাধিক পরিবর্তন করতে হয়, তাহলে আপনি প্রপার্টিটিকে প্রথমে YES এবং তারপর আবার NO তে পরিবর্তন করতে পারেন।
  • যখন কোনো অ্যানিমেশন চলে বা কন্টেন্টগুলো অ্যাসিঙ্ক্রোনাসভাবে লোড হয়, তখন অ্যাকশনগুলো সম্পূর্ণ না হওয়া পর্যন্ত প্রপার্টিটি YES এ সেট করে রাখা উচিত।

মার্কারের অস্বচ্ছতা পরিবর্তন করা

আপনি একটি মার্কারের অস্বচ্ছতা তার opacity প্রপার্টির মাধ্যমে নিয়ন্ত্রণ করতে পারেন। আপনাকে অস্বচ্ছতা ০.০ এবং ১.০-এর মধ্যে একটি ফ্লোট সংখ্যা হিসেবে উল্লেখ করতে হবে, যেখানে ০ হলো সম্পূর্ণ স্বচ্ছ এবং ১ হলো সম্পূর্ণ অস্বচ্ছ।

সুইফট 

marker.opacity = 0.6

উদ্দেশ্য-সি 

marker.opacity = 0.6;

আপনি GMSMarkerLayer ব্যবহার করে Core Animation-এর মাধ্যমে মার্কারের অস্বচ্ছতা অ্যানিমেট করতে পারেন।

একটি মার্কার সমতল করা

মার্কার আইকনগুলো সাধারণত ম্যাপের পৃষ্ঠের পরিবর্তে ডিভাইসের স্ক্রিনের সাপেক্ষে আঁকা হয়, তাই ম্যাপ ঘোরানো, কাত করা বা জুম করলে মার্কারের অভিমুখ পরিবর্তন নাও হতে পারে।

আপনি একটি মার্কারের অভিমুখ পৃথিবীর সাথে সমতলে সেট করতে পারেন। মানচিত্র ঘোরানো হলে সমতল মার্কারগুলোও ঘোরে এবং মানচিত্র কাত করলে এদের দৃষ্টিকোণ পরিবর্তিত হয়। সাধারণ মার্কারের মতোই, মানচিত্র জুম ইন বা আউট করা হলেও সমতল মার্কারগুলো তাদের আকার বজায় রাখে।

মার্কারের অভিমুখ পরিবর্তন করতে, মার্কারটির flat প্রপার্টিকে YES বা true তে সেট করুন।

সুইফট 

let positionLondon = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127)
let londonMarker = GMSMarker(position: positionLondon)
londonMarker.isFlat = true
londonMarker.map = mapView

উদ্দেশ্য-সি 

CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *londonMarker = [GMSMarker markerWithPosition:positionLondon];
londonMarker.flat = YES;
londonMarker.map = mapView;

একটি মার্কার ঘোরানো

আপনি rotation প্রপার্টি সেট করে একটি মার্কারকে তার অ্যাঙ্কর পয়েন্টের চারপাশে ঘোরাতে পারেন। রোটেশনটি CLLocationDegrees টাইপের হিসাবে নির্দিষ্ট করুন, যা ডিফল্ট অবস্থান থেকে ঘড়ির কাঁটার দিকে ডিগ্রিতে পরিমাপ করা হয়। যখন মার্কারটি ম্যাপের উপর সমতলে থাকে, তখন ডিফল্ট অবস্থানটি উত্তর দিক হয়।

নিম্নলিখিত উদাহরণটি মার্কারটিকে ৯০° ঘোরায়। groundAnchor প্রপার্টির মান 0.5,0.5 সেট করলে মার্কারটি তার ভিত্তির পরিবর্তে নিজের কেন্দ্রকে ঘিরে ঘোরে।

সুইফট 

let degrees = 90.0
londonMarker.groundAnchor = CGPoint(x: 0.5, y: 0.5)
londonMarker.rotation = degrees
londonMarker.map = mapView

উদ্দেশ্য-সি 

CLLocationDegrees degrees = 90;
londonMarker.groundAnchor = CGPointMake(0.5, 0.5);
londonMarker.rotation = degrees;
londonMarker.map = mapView;

মার্কারে ইভেন্ট পরিচালনা করা

আপনি ম্যাপে ঘটা ইভেন্টগুলো শুনতে পারেন, যেমন যখন কোনো ব্যবহারকারী একটি মার্কার ট্যাপ করেন। ইভেন্ট শোনার জন্য, আপনাকে অবশ্যই GMSMapViewDelegate প্রোটোকলটি ইমপ্লিমেন্ট করতে হবে। নির্দিষ্ট মার্কার ইভেন্টগুলো কীভাবে হ্যান্ডেল করতে হয় তা জানতে মার্কার ইভেন্ট এবং জেসচার দেখুন। ইভেন্ট সম্পর্কিত গাইডটিতে GMSMapViewDelegate-এর মেথডগুলোর একটি তালিকাও দেওয়া আছে। স্ট্রিট ভিউ ইভেন্টের জন্য, GMSPanoramaViewDelegate দেখুন।