Google Maps GMSMapView on custom UIView

Question

I want to display google maps in a view, which is then added to self.view , instead of drawing the map directly on self.view . So I created a view in a storyboard and changed its class to GMSMapView . I also created an output connection with this view called gmView .

I use the following code, which, unfortunately, does not display the map:

 let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: GMSCameraPosition.camera(withLatitude: 51.050657, longitude: 10.649514, zoom: 5.5)) gmView = mapView 

In addition, I tried adding mapView to self.view as a subquery, for example:

 self.view.addSubview(mapView) 

... and inserting it:

 self.view.insertSubview(mapView, at: 0) 

Please note that I am using Auto Layout if this changes anything.

None of these approaches seem to work for me.
Any ideas?

Answer 1

If you want to add a mapView after loading the view , you need to create a GMSMapView object. Therefore, break the outputs of your mapView , as it will be created dynamically.

 import UIKit import GoogleMaps class MapViewController: UIViewController { //Take a Google Map Object. Don't make outlet from Storyboard, Break the outlet of GMSMapView if you made an outlet var mapView:GMSMapView? override func viewDidLoad() { super.viewDidLoad() mapView = GMSMapView.map(withFrame: CGRect(x: 100, y: 100, width: 200, height: 200), camera: GMSCameraPosition.camera(withLatitude: 51.050657, longitude: 10.649514, zoom: 5.5)) //so the mapView is of width 200, height 200 and its center is same as center of the self.view mapView?.center = self.view.center self.view.addSubview(mapView!) } } 

Here is the result. mapView has width = 200 and height = 200 centered just like self.view

Answer 2

I finally figured out how to display a map in a UIView created in Storyboard and center it in a specific place.

Note. After creating the UIView output, I changed my class to GMSMapView, as explained earlier.

 import UIKit import GoogleMaps class ViewController: UIViewController { @IBOutlet weak var searchBar: UISearchBar! @IBOutlet weak var toolBar: UIToolbar! @IBOutlet weak var mapView: GMSMapView! override func viewDidLoad() { super.viewDidLoad() let camera = GMSCameraPosition.camera(withLatitude: 52.520736, longitude: 13.409423, zoom: 12) self.mapView.camera = camera let initialLocation = CLLocationCoordinate2DMake(52.520736, 13.409423) let marker = GMSMarker(position: initialLocation) marker.title = "Berlin" marker.map = mapView } 

And this is the result: The map is concentrated in Berlin

Answer 3

You can put an empty UIView in your layout and set its class in the inspector as a GMSMapView. You do not need to programmatically instantiate it.

Then just get the link through the exit to the view and set the coordinates / camera.

Answer 4

CGRect.zero will return a view with zero height and zero width. He will be invisible.

In addition, it makes no sense to add it to the storyboard if you want to make your own distribution. Instead, you should simply create the property of the view controller programmatically and set its frame as you like.

Note that when you call addSubview on a view, it is always added to the top of the view, so there is no need to insert it into this index. Using automatic layout is good, but viewDidLoad () is called before all restrictions are set. If you want to set your mapView frame = self.view, you would like to do this in viewDidAppear ().