मार्कर, मैप पर एक जगह की जानकारी देते हैं.
डिफ़ॉल्ट रूप से, मार्कर में एक स्टैंडर्ड आइकॉन का इस्तेमाल होता है. यह आइकॉन, Google Maps के सामान्य आइकॉन जैसा ही दिखता है. अगर आपको मार्कर को पसंद के मुताबिक बनाना है, तो डिफ़ॉल्ट मार्कर का रंग बदला जा सकता है. इसके अलावा, मार्कर की इमेज को कस्टम आइकॉन से बदला जा सकता है या मार्कर की अन्य प्रॉपर्टी बदली जा सकती हैं.
मार्कर पर क्लिक इवेंट के जवाब में, जानकारी वाली विंडो खोली जा सकती है. जानकारी वाली विंडो, मार्कर के ऊपर डायलॉग विंडो में टेक्स्ट या इमेज दिखाती है. टेक्स्ट दिखाने के लिए, डिफ़ॉल्ट जानकारी वाली विंडो का इस्तेमाल किया जा सकता है. इसके अलावा, जानकारी वाली विंडो के कॉन्टेंट को पूरी तरह से कंट्रोल करने के लिए, अपनी पसंद के मुताबिक़ जानकारी वाली विंडो बनाई जा सकती है.
मार्कर जोड़ना
मार्कर जोड़ने के लिए, ऐसा GMSMarker
ऑब्जेक्ट बनाएं जिसमें position
और title
शामिल हों. इसके बाद, उसका map
सेट करें.
यहां दिए गए उदाहरण में, किसी मौजूदा GMSMapView
ऑब्जेक्ट में मार्कर जोड़ने का तरीका बताया गया है. मार्कर, निर्देशांक 10,10
पर बनाया गया है. इस पर क्लिक करने पर, जानकारी वाली विंडो में "नमस्ते दुनिया" स्ट्रिंग दिखती है.
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
की आइकॉन प्रॉपर्टी में पास करें.
marker.icon = GMSMarker.markerImage(with: .black)
marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];
मार्कर इमेज को पसंद के मुताबिक बनाना
अगर आपको मार्कर की डिफ़ॉल्ट इमेज बदलनी है, तो मार्कर की icon
या iconView
प्रॉपर्टी का इस्तेमाल करके, कोई कस्टम आइकॉन सेट किया जा सकता है. अगर iconView
सेट है, तो एपीआई 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
का इस्तेमाल किया जा सकता है. इसलिए, अपने मार्कर तय करने के लिए, स्टैंडर्ड यूज़र इंटरफ़ेस (यूआई) कंट्रोल की हैरारकी बनाई जा सकती है. हर व्यू में ऐनिमेशन की सुविधाओं का स्टैंडर्ड सेट होता है. मार्कर के साइज़, रंग, और अल्फा लेवल में बदलाव किए जा सकते हैं. साथ ही, अपनी पसंद के मुताबिक बदलाव भी किए जा सकते हैं. iconView
प्रॉपर्टी, frame
और
center
को छोड़कर, UIView
की उन सभी प्रॉपर्टी के लिए ऐनिमेशन की सुविधा देता है जिनमें ऐनिमेशन जोड़ा जा सकता है.
iconView
का इस्तेमाल करते समय, कृपया इन बातों का ध्यान रखें:
tracksViewChanges
कोYES
पर सेट करने पर,UIView
के लिए ज़्यादा संसाधनों की ज़रूरत पड़ सकती है. इससे बैटरी खर्च बढ़ सकता है. इसकी तुलना में, एक फ़्रेमUIImage
स्टैटिक होता है और उसे फिर से रेंडर करने की ज़रूरत नहीं होती.- अगर स्क्रीन पर कई मार्कर हैं और हर मार्कर का अपना
UIView
है और सभी मार्कर एक साथ बदलावों को ट्रैक कर रहे हैं, तो हो सकता है कि कुछ डिवाइसों पर मैप रेंडर करने में समस्या आएं. iconView
, उपयोगकर्ता के इंटरैक्शन का जवाब नहीं देता, क्योंकि यह व्यू का स्नैपशॉट होता है.- व्यू इस तरह काम करता है जैसे
clipsToBounds
की वैल्यूYES
पर सेट हो, भले ही उसकी असल वैल्यू कुछ भी हो. ऐसे ट्रांसफ़ॉर्म लागू किए जा सकते हैं जो बॉउंड के बाहर काम करते हैं. हालांकि, आपका खींचा गया ऑब्जेक्ट, ऑब्जेक्ट के बॉउंड में होना चाहिए. सभी ट्रांसफ़ॉर्म/शिफ़्ट की निगरानी की जाती है और उन्हें लागू किया जाता है. खास जानकारी: सबव्यू, व्यू में होने चाहिए.
tracksViewChanges
प्रॉपर्टी को कब सेट करना है, यह तय करने के लिए आपको परफ़ॉर्मेंस से जुड़ी बातों को ध्यान में रखना चाहिए. साथ ही, मार्कर को अपने-आप फिर से ड्रॉ होने के फ़ायदों को भी ध्यान में रखना चाहिए. उदाहरण के लिए:
- अगर आपको कई बदलाव करने हैं, तो प्रॉपर्टी को
YES
पर सेट करें. इसके बाद, उसे फिर सेNO
पर सेट करें. - जब कोई ऐनिमेशन चल रहा हो या कॉन्टेंट अलग-अलग समय पर लोड हो रहा हो, तो आपको प्रॉपर्टी को
YES
पर सेट करके रखना चाहिए. ऐसा तब तक करें, जब तक सभी कार्रवाइयां पूरी न हो जाएं.
मार्कर की ओपैसिटी बदलना
मार्कर की opacity
प्रॉपर्टी की मदद से, उसकी ओपैसिटी को कंट्रोल किया जा सकता है. आपको ओपैसिटी को 0.0 और 1.0 के बीच के फ़्लोट के तौर पर बताना चाहिए. यहां 0 पूरी तरह से पारदर्शी और 1 पूरी तरह से अपारदर्शी है.
marker.opacity = 0.6
marker.opacity = 0.6;
GMSMarkerLayer
का इस्तेमाल करके, कोर ऐनिमेशन की मदद से मार्कर की ओपैसिटी को ऐनिमेट किया जा सकता है.
मार्कर को फ़्लैट करना
मार्कर आइकॉन आम तौर पर, मैप के बजाय डिवाइस की स्क्रीन के हिसाब से बनाए जाते हैं. इसलिए, मैप को घुमाने, झुकाने या ज़ूम करने से, मार्कर का ओरिएंटेशन ज़रूरी नहीं है कि बदल जाए.
मार्कर के ओरिएंटेशन को धरती के हिसाब से फ़्लैट किया जा सकता है. मैप को घुमाने पर, फ़्लैट मार्कर घूम जाते हैं. साथ ही, मैप को झुकाने पर, इनका पर्सपेक्टिव बदल जाता है. मैप को ज़ूम इन या ज़ूम आउट करने पर, फ़्लैट मार्कर का साइज़ नहीं बदलता.
मार्कर का ओरिएंटेशन बदलने के लिए, मार्कर की 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
टाइप के तौर पर बताएं. इसे डिफ़ॉल्ट पोज़िशन से, घड़ी की दिशा में डिग्री में मेज़र किया जाता है. जब मार्कर मैप पर सीधा हो, तो डिफ़ॉल्ट तौर पर उसकी स्थिति उत्तर होती है.
इस उदाहरण में मार्कर को 90° घुमाया गया है. 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 पर मौजूद तरीकों की सूची भी दी गई है. Street View इवेंट के बारे में जानने के लिए, GMSPanoramaViewDelegate
देखें.