GMSMarker icon from center (iOS)
Asked Answered
V

3

33

I just switched from Apple Maps to Google Maps. An issue that I can't seem to find an answer to is how do you make the icon for a GMSMarker to start from the center rather then from the bottom of the image.

An example of what I mean is the current location dot icon starts centered at the coordinates it is meant to express. However GMSMarkers icons start from the bottom of the icon.

Vargueno answered 10/3, 2015 at 4:5 Comment(0)
A
65

You can change the start position of your marker icon with the property groundAnchor.

Google Maps SDK for iOS documentation:

The ground anchor specifies the point in the icon image that is anchored to the marker's position on the Earth's surface. This point is specified within the continuous space [0.0, 1.0] x [0.0, 1.0], where (0,0) is the top-left corner of the image, and (1,1) is the bottom-right corner.

Example:

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_;
Allier answered 10/3, 2015 at 9:29 Comment(2)
For those that simply want to shift the marker position, all you need is yourMarker.groundAnchor = CGPoint(0.5, 0.5); Thanks @adboco!Plug
For swift use following code:- let position = CLLocationCoordinate2D(latitude: latitude, longitude: longitude) let degrees = CLLocationDegrees(90) marker = GMSMarker(position: position) marker.groundAnchor = CGPoint(x: 0.5, y: 0.5) marker.rotation = degreesSocorrosocotra
V
7

I figured out how to do it after reading Google Maps Documentation very closely. I believe this is how it was intended to be done.

UIImage *markerIcon = [UIImage imageNamed:@"markericon.png"];
markerIcon = [markerIcon imageWithAlignmentRectInsets:UIEdgeInsetsMake(0, 0, (markerIcon.size.height/2), 0)];
self.marker.icon = markerIcon;
Vargueno answered 10/3, 2015 at 4:55 Comment(2)
I tried this method and it looks like it works but it causes some unintended side effects... doing this does not shift the tappable area so the area outside the original marker's rect will not be tappable.Plug
I tried it but not working. but this issue can be solved using Marker.groundAnchor = CGPoint(0.5, 0.5); for obj c and marker.groundAnchor = CGPoint(x: 0.5, y: 0.5) for swiftSocorrosocotra
B
5

In Swift 5

    let marker: GMSMarker = GMSMarker() // Allocating Marker
    marker.title = "Your location" // Setting title
    marker.snippet = "Sub title" // Setting sub title
    marker.icon = UIImage(named: "radio") // Marker icon
    marker.appearAnimation = .pop // Appearing animation. default
    marker.position = CLLocationCoordinate2D.init(latitude: 26.8289443, longitude: 75.8056178)
    
    marker.groundAnchor = CGPoint(x: 0.5, y: 0.5)  // this is the answer of this question
            
    DispatchQueue.main.async { // Setting marker on mapview in main thread.
        marker.map = self.googleMapView // Setting marker on Mapview
    }
Burstone answered 27/6, 2020 at 17:14 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.