मार्कर कस्टमाइज़ेशन

प्लैटफ़ॉर्म चुनें: Android iOS JavaScript

अलग-अलग कस्टम मार्कर का स्क्रीनशॉट

मार्कर की जानकारी देने के लिए, बेहतर मार्कर दो क्लास का इस्तेमाल करते हैं: GMSAdvancedMarker क्लास, डिफ़ॉल्ट मार्कर की क्षमताएं देती है और GMSPinImageOptions में मार्कर को पसंद के मुताबिक बनाने के विकल्प शामिल होते हैं. इस पेज में नीचे दिए गए तरीकों से मार्कर को पसंद के मुताबिक बनाने का तरीका बताया गया है:

  • बैकग्राउंड का रंग बदलना
  • बॉर्डर का रंग बदलें
  • ग्लिफ़ का रंग बदलें
  • ग्लिफ़ टेक्स्ट बदलें
  • आइकन व्यू प्रॉपर्टी के साथ कस्टम व्यू और ऐनिमेशन के साथ काम करें
बेहतर मार्कर के हिस्से
पहली इमेज: ऐडवांस मार्कर के हिस्से.

बैकग्राउंड का रंग बदलना

किसी मार्कर के बैकग्राउंड का रंग बदलने के लिए, GMSPinImageOptions.backgroundColor विकल्प का इस्तेमाल करें.

Swift

//...

let options = GMSPinImageOptions()
options.backgroundColor = .blue

let pinImage = GMSPinImage(options: options)
advancedMarker.icon = pinImage

advancedMarker.map = mapView

Objective-C

//...

GMSPinImageOptions *options = [[GMSPinImageOptions alloc] init];
options.backgroundColor = [UIColor blueColor];

GMSPinImage *pin = [GMSPinImage pinImageWithOptions:options];
customTextMarker.icon = pin;

customTextMarker.map = mapView;

बॉर्डर का रंग बदलें

किसी मार्कर के बैकग्राउंड का रंग बदलने के लिए, GMSPinImageOptions.borderColor विकल्प का इस्तेमाल करें.

Swift

//...

let options = GMSPinImageOptions()
options.borderColor = .blue

let pinImage = GMSPinImage(options: options)
advancedMarker.icon = pinImage

advancedMarker.map = mapView

Objective-C

//...

GMSPinImageOptions *options = [[GMSPinImageOptions alloc] init];
options.backgroundColor = [UIColor blueColor];

GMSPinImage *pin = [GMSPinImage pinImageWithOptions:options];
advancedMarker.icon = pin;

advancedMarker.map = mapView;

ग्लिफ़ का रंग बदलें

किसी मार्कर के बैकग्राउंड का रंग बदलने के लिए, GMSPinImageGlyph.glyphColor का इस्तेमाल करें.

Swift

//...

let options = GMSPinImageOptions()

let glyph = GMSPinImageGlyph(glyphColor: .yellow)
options.glyph = glyph

let glyphColor = GMSPinImage(options: options)

advancedMarker.icon = glyphColor
advancedMarker.map = mapView

Objective-C

//...

GMSPinImageOptions *options = [[GMSPinImageOptions alloc] init];

options.glyph = [[GMSPinImageGlyph alloc] initWithGlyphColor:[UIColor yellowColor]];
GMSPinImage *glyphColor = [GMSPinImage pinImageWithOptions:options];

advancedMarker.icon = glyphColor;
advancedMarker.map = mapView;

ग्लिफ़ टेक्स्ट बदलें

किसी मार्कर का ग्लिफ़ टेक्स्ट बदलने के लिए, GMSPinImageGlyph का इस्तेमाल करें.

Swift

//...

let options = GMSPinImageOptions()

let glyph = GMSPinImageGlyph(text: "ABC", textColor: .white)
options.glyph = glyph

let pinImage = GMSPinImage(options: options)

advancedMarker.icon = pinImage
advancedMarker.map = mapView

Objective-C

//...

GMSPinImageOptions *options = [[GMSPinImageOptions alloc] init];

options.glyph = [[GMSPinImageGlyph alloc] initWithText:@"ABC" textColor:[UIColor whiteColor]];
GMSPinImage *pin = [GMSPinImage pinImageWithOptions:options];

customTextMarker.icon = pin;
customTextMarker.map = mapView;

iconView प्रॉपर्टी का इस्तेमाल करके, कस्टम व्यू और ऐनिमेशन के साथ काम करें

GMSMarker की तरह, GMSAdvancedMarker भी iconView वाले मार्कर के साथ काम करता है. iconView प्रॉपर्टी, फ़्रेम और सेंटर को छोड़कर UIView की सभी ऐनिमेट होने वाली प्रॉपर्टी के ऐनिमेशन के साथ काम करती है. यह एक ही मैप पर दिखाए गए iconViews और icons वाले मार्कर के साथ काम नहीं करता.

Swift

//...

let advancedMarker = GMSAdvancedMarker(position: coordinate)
advancedMarker.iconView = customView()
advancedMarker.map = mapView

func customView() -> UIView {
// return your custom UIView.
}

Objective-C

//...

GMSAdvancedMarker *advancedMarker = [GMSAdvancedMarker markerWithPosition:kCoordinate];
advancedMarker.iconView = [self customView];
advancedMarker.map = self.mapView;

-   (UIView *)customView {
  // return custom view
}

लेआउट कंस्ट्रेंट

GMSAdvancedMarker अपने iconView के लिए, लेआउट की सीमाओं के साथ सीधे तौर पर काम नहीं करता. हालांकि, iconView में यूज़र इंटरफ़ेस एलिमेंट के लिए लेआउट कंस्ट्रेंट सेट किया जा सकता है. अपना व्यू बनाने के बाद, ऑब्जेक्ट frame या size को मार्कर में पास किया जाना चाहिए.

Swift

//do not set advancedMarker.iconView.translatesAutoresizingMaskIntoConstraints = false

let advancedMarker = GMSAdvancedMarker(position: coordinate)
let customView = customView()

//set frame
customView.frame = CGRect(0, 0, width, height)

advancedMarker.iconView = customView

Objective-C

//do not set advancedMarker.iconView.translatesAutoresizingMaskIntoConstraints = NO;

GMSAdvancedMarker *advancedMarker = [GMSAdvancedMarker markerWithPosition:kCoordinate];

CustomView *customView = [self customView];

//set frame
customView.frame = CGRectMake(0, 0, width, height);

advancedMarker.iconView = customView;