Google Maps SDK for iOS

Markers

Markers indicate single locations on the map. You can customize your markers by replacing the default icon with a custom image, or adjusting the image offset.

Introduction

Markers identify locations on the map. A marker added with the Google Maps SDK for iOS will use a standard icon, common to the Google Maps look and feel. If you would like to use an alternate image, you can programmatically alter the default icon and anchor point. Markers are objects of type GMSMarker, and are added to the map by setting the map property.

Add a marker

To add a marker you create a GMSMarker object that includes a position, title and set its map.

The below example demonstrates how to add a marker to an existing GMSMapView object. The marker is created at coordinates 0,0, and displays the string "Hello world" in an info window when clicked.

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(0, 0);
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.

Remove a marker

You can remove a marker from the map by setting your GMSMarker's map property to nil. Alternately, you can remove all of the overlays (including markers) currently on the map by calling the GMSMapView clear method.

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.

GMSMarker *marker = [GMSMarker markerWithPosition:position];
marker.map = mapView_;
...
marker.map = nil;

Customize a marker

You can customize a marker's image by either changing the color of the default marker, or replacing the marker image with a custom icon.

Change the default 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 markerImageWithColor:[UIColor blackColor]];

Change the default marker icon

If you'd like to change the default marker image you can set a custom icon. Custom icons are always set as a UIImage object. The below snippet creates a marker with a custom icon centered at London, England. The snippet assumes that your application contains an image named "house.png".

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
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 will help improve the performance of your application when displaying many markers.

This image may have multiple frames. Additionally, the alignmentRectInsets property is respected, useful if a marker has a shadow or other unusable region.

Change the marker opacity

You can control the opacity of a marker with its opacity property. Opacity should be specified as a float between 0.0 and 1.0, where 0 is fully transparent and 1 is fully opaque.

marker.opacity = 0.6;

Marker opacity can be animated with Core Animation via the GMSMarkerLayer.

Flatten a marker

Marker icons are normally drawn oriented against the device's screen rather than the map's surface, so rotating, tilting or zooming the map will not necessarily change the orientation of the marker.

You can set the orientation of a marker to be flat against the earth. Flat markers will rotate when the map is rotated, and change perspective when the map is tilted. As with regular markers, flat markers will 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.

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.flat = YES;
london.map = mapView_;

Rotate a marker

You can rotate a marker around its anchor point by setting the rotation property. The rotation is specified as a CLLocationDegrees, and measured in degrees clockwise from the default position. When the marker is flat on the map, the default position is North.

The below 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.

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
CLLocationDegrees degrees = 90;
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.groundAnchor = CGPointMake(0.5, 0.5);
london.rotation = degrees;
london.map = mapView_;

Info windows

An info window allows you to display information to the user when they tap on a marker. Only one info window is displayed at a time. If a user taps on another marker, the current window will be hidden and the new info window will be displayed. The contents of the info window are defined by the title and snippet properties. Clicking the marker will not display an info window if both the title and snippet properties are blank or nil.

The below snippet creates a simple marker, with only a title for the text of the info window.

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.map = mapView_;

With the snippet property, you can add additional text that will appear below the title, in a smaller font. Strings that are longer than the width of the info window will automatically wrap across several lines. Very long messages may be truncated.

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.map = mapView_;

An info window is drawn oriented against the device's screen, centered above its associated marker. You can alter the position of the info window relative to the marker by setting the infoWindowAnchor property. This property accepts a CGPoint, defined as an (x,y) offset where both x and y range between 0.0 and 1.0. The default offset is (0.5, 0.0), i.e., the center top. Setting the infoWindowAnchor offset is useful for aligning the info window against a custom icon.

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.infoWindowAnchor = CGPointMake(0.5, 0.5);
london.icon = [UIImage imageNamed:@"house"];
london.map = mapView_;

Authentication required

You need to be signed in with Google+ to do that.

Signing you in...

Google Developers needs your permission to do that.