Stay organized with collections Save and categorize content based on your preferences.
Markers indicate single locations on the map.
By default, markers use a standard icon that has the common Google Maps look and feel. If you want to customize your marker, you can change the color of the default marker, or replace the marker image with a custom icon, or change other properties of the marker.
In response to a click event on a marker, you can open an info window. An info window displays text or images in a dialog window above the marker. You can use a default info window to display text, or create your own custom info window to completely control its content.
Adding a markerTo add a marker, create a GMSMarker
object that includes a position
and title
, and set its map
.
The following example demonstrates how to add a marker to an existing GMSMapView
object. The marker is created at coordinates 10,10
, and displays the string "Hello world" in an info window when clicked.
let position = CLLocationCoordinate2D(latitude: 10, longitude: 10) let marker = GMSMarker(position: position) marker.title = "Hello World" marker.map = mapViewObjective-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10); GMSMarker *marker = [GMSMarker markerWithPosition:position]; marker.title = @"Hello World"; marker.map = mapView;
You can animate the addition of new markers to the map by setting the marker.appearAnimation
property to:
kGMSMarkerAnimationPop
to cause the marker to pop from its groundAnchor
when added.kGMSMarkerAnimationFadeIn
to cause the marker to fade in when added.You can remove a marker from the map by setting the map
property of the GMSMarker
to nil
. Alternatively, you can remove all of the overlays (including markers) currently on the map by calling the GMSMapView
clear
method.
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];
If you wish to make modifications to a marker after you've added it to the map, ensure that you keep hold of the GMSMarker
object. You can modify the marker later by making changes to this object.
let position = CLLocationCoordinate2D(latitude: 10, longitude: 10) let marker = GMSMarker(position: position) marker.map = mapView // ... marker.map = nilObjective-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(10, 10); GMSMarker *marker = [GMSMarker markerWithPosition:position]; marker.map = mapView; // ... marker.map = nil;Changing the marker color
You can customize the color of the default marker image by requesting a tinted version of the default icon with markerImageWithColor:
, and passing the resulting image to the GMSMarker
's icon property.
marker.icon = GMSMarker.markerImage(with: .black)Objective-C
marker.icon = [GMSMarker markerImageWithColor:[UIColor blackColor]];Customizing the marker image
If you want to change the default marker image you can set a custom icon, using the marker's icon
or iconView
property. If iconView
is set, the API ignores the icon
property.
icon
property
The following snippet creates a marker with a custom icon provided as a UIImage
in the icon
property. The icon is centered at London, England. The snippet assumes that your application contains an image named "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 = mapViewObjective-C
CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127); GMSMarker *london = [GMSMarker markerWithPosition:positionLondon]; london.title = @"London"; london.icon = [UIImage imageNamed:@"house"]; london.map = mapView;
If you are creating several markers with the same image, use the same instance of UIImage
for each of the markers. This helps improve the performance of your application when displaying many markers.
This image may have multiple frames. Additionally, the alignmentRectInsets
property is respected, which is useful if a marker has a shadow or other unusable region.
iconView
property
The following snippet creates a marker with a custom icon by setting the marker's iconView
property, and animates a change in the color of the marker. The snippet assumes that your application contains an image named "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 }) } }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
Because iconView
accepts a UIView
, you can have a hierarchy of standard UI controls defining your markers, each view having the standard set of animation capabilities. You can include changes to the marker size, color, and alpha levels, as well as applying arbitrary transformations. The iconView
property supports animation of all animatable properties of UIView
except frame
and center
.
Please note the following considerations when using iconView
:
UIView
can be demanding on resources when tracksViewChanges
is set to YES
, which may result in increased battery usage. In comparison, a single frame UIImage
is static and does not need to be re-rendered.UIView
, and all markers are tracking changes at the same time.iconView
does not respond to user interaction, as it is a snapshot of the view.clipsToBounds
is set to YES
, regardless of its actual value. You can apply transforms that work outside the bounds, but the object you draw must be within the bounds of the object. All transforms/shifts are monitored and applied. In short: subviews must be contained within the view.-copyWithZone:
on GMSMarker
, you must copy the GMSMarker
first and then set a new instance of the iconView
on the copy. UIView
does not support NSCopying
, so it can't copy the iconView
.To decide when to set the tracksViewChanges
property, you should weigh up performance considerations against the advantages of having the marker redrawn automatically. For example:
YES
then back to NO
.YES
until the actions are complete.You can control the opacity of a marker with its opacity
property. You should specify the opacity as a float between 0.0 and 1.0, where 0 is fully transparent and 1 is fully opaque.
marker.opacity = 0.6Objective-C
marker.opacity = 0.6;
You can animate the marker opacity with Core Animation using GMSMarkerLayer
.
Marker icons are normally drawn oriented against the device's screen rather than the map's surface, so rotating, tilting or zooming the map does not necessarily change the orientation of the marker.
You can set the orientation of a marker to be flat against the earth. Flat markers rotate when the map is rotated, and change perspective when the map is tilted. As with regular markers, flat markers retain their size when the map is zoomed in or out.
To change the orientation of the marker, set the marker's flat
property to YES
or true
.
let positionLondon = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127) let londonMarker = GMSMarker(position: positionLondon) londonMarker.isFlat = true londonMarker.map = mapViewObjective-C
CLLocationCoordinate2D positionLondon = CLLocationCoordinate2DMake(51.5, -0.127); GMSMarker *londonMarker = [GMSMarker markerWithPosition:positionLondon]; londonMarker.flat = YES; londonMarker.map = mapView;Rotating a marker
You can rotate a marker around its anchor point by setting the rotation
property. Specify the rotation as a CLLocationDegrees
type, measured in degrees clockwise from the default position. When the marker is flat on the map, the default position is North.
The following example rotates the marker 90°. Setting the groundAnchor
property to 0.5,0.5
causes the marker to be rotated around its center, instead of its base.
let degrees = 90.0 londonMarker.groundAnchor = CGPoint(x: 0.5, y: 0.5) londonMarker.rotation = degrees londonMarker.map = mapViewObjective-C
CLLocationDegrees degrees = 90; londonMarker.groundAnchor = CGPointMake(0.5, 0.5); londonMarker.rotation = degrees; londonMarker.map = mapView;Handling events on markers
You can listen to events that occur on the map, such as when a user taps a marker. To listen to events, you must implement the GMSMapViewDelegate
protocol. See marker events and gestures to learn how to handle specific marker events. The guide to events also provides a list of methods on GMSMapViewDelegate. For Street View events, see GMSPanoramaViewDelegate
.
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2025-07-23 UTC.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-07-23 UTC."],[[["Markers identify specific locations on a map, customizable with icons, colors, and info windows for displaying information."],["You can add markers using the `GMSMarker` object, specifying position and title, and control their visibility using the `map` property."],["Customize markers using the `icon` or `iconView` properties, allowing the use of custom images or even interactive UI elements."],["Control marker appearance with properties like `opacity`, `flat` for ground orientation, and `rotation` for adjusting the angle."],["Handle user interactions with markers by implementing the `GMSMapViewDelegate` protocol to respond to events like taps."]]],["Markers indicate single locations on a map and can be customized by changing their color, or replacing them with custom icons. To add a marker, create a `GMSMarker` object with a position and title, then set its map. Markers can be animated upon addition and removed by setting the `map` property to `nil`. The `iconView` property allows using custom UI elements as marker icons, and markers can be made flat or rotated. You can handle marker click events via `GMSMapViewDelegate`.\n"]]
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4