I'm having a hard time figuring out how to make the annotation title appear when a user tapped an annotation pointed to the current location. Everything is working fine except this. I am using CLLocationManager wrapper from https://github.com/varshylmobile/LocationManager but I don't think it's affecting the Mapbox since I can display my pins correctly on the map.
Here's the screenshot sample:
As you can see, I could run the app without any problems. It's just when I set some annotation title and subtitle to the pin, and tapped it at run-time, it doesn't show anything.
Here's my code snippet for the annotation:
let point = MGLPointAnnotation()
point.coordinate = CLLocationCoordinate2D(latitude: location.coordinate.latitude, longitude: location.coordinate.longitude)
point.title = "Hello world!"
point.subtitle = "Welcome to The Ellipse."
self.mapView.addAnnotation(point)
let point2 = MGLPointAnnotation()
point2.coordinate = CLLocationCoordinate2D(latitude: 37.43259552, longitude: location.coordinate.longitude)
point2.title = "Hello world!"
point2.subtitle = "Welcome to The Ellipse."
self.mapView.addAnnotation(point2)
self.mapView.selectAnnotation(point, animated: true)
self.mapView.showAnnotations([point, point2], animated: true)
and here is the call out function:
func mapView(mapView: MGLMapView, annotationCanShowCallout annotation: MGLAnnotation) -> Bool {
return true
}
func mapView(mapView: MGLMapView, imageForAnnotation annotation: MGLAnnotation) -> MGLAnnotationImage? {
return nil
}
I am on iOS 9.2, xCode 7.
Thank you!
I forgot this line of code after instantiating my map view.
mapView.delegate = self
Thanks!
Here's an example of how to configure basic callout views with the Mapbox iOS SDK:
import Mapbox
class ViewController: UIViewController, MGLMapViewDelegate {
var mapView: MGLMapView!
override func viewDidLoad() {
super.viewDidLoad()
mapView = MGLMapView(frame: view.bounds)
mapView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
view.addSubview(mapView)
// remember to set the delegate (or much of this will not work)
mapView.delegate = self
addAnnotation()
}
func addAnnotation() {
let annotation = MGLPointAnnotation()
annotation.coordinate = CLLocationCoordinate2DMake(35.03946, 135.72956)
annotation.title = "Kinkaku-ji"
annotation.subtitle = "\(annotation.coordinate.latitude), \(annotation.coordinate.longitude)"
mapView.addAnnotation(annotation)
// fit the map to the annotation(s)
mapView.showAnnotations(mapView.annotations!, animated: false)
// pop-up the callout view
mapView.selectAnnotation(annotation, animated: true)
}
func mapView(mapView: MGLMapView, annotationCanShowCallout annotation: MGLAnnotation) -> Bool {
return true
}
func mapView(mapView: MGLMapView, leftCalloutAccessoryViewForAnnotation annotation: MGLAnnotation) -> UIView? {
if (annotation.title! == "Kinkaku-ji") {
let label = UILabel(frame: CGRectMake(0, 0, 60, 50))
label.textAlignment = .Right
label.textColor = UIColor(red: 0.81, green: 0.71, blue: 0.23, alpha: 1)
label.text = "金閣寺"
return label
}
return nil
}
func mapView(mapView: MGLMapView, rightCalloutAccessoryViewForAnnotation annotation: MGLAnnotation) -> UIView? {
return UIButton(type: .DetailDisclosure)
}
func mapView(mapView: MGLMapView, annotation: MGLAnnotation, calloutAccessoryControlTapped control: UIControl) {
// hide the callout view
mapView.deselectAnnotation(annotation, animated: false)
UIAlertView(title: annotation.title!!, message: "A lovely (if touristy) place.", delegate: nil, cancelButtonTitle: nil, otherButtonTitles: "OK").show()
}
}
Related
I am very confused why this is displaying the default image instead of a round blue circle over New York. Any insight about this as well as when the default image is used will be greatly appreciated.
import UIKit
import Mapbox
class ViewController: UIViewController, MGLMapViewDelegate {
override func viewDidLoad() {
super.viewDidLoad()
setupMapview()
}
func setupMapview(){
let mapView = MGLMapView(frame: view.bounds)
mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
mapView.setCenter(CLLocationCoordinate2D(latitude: 40.74699, longitude: -73.98742), zoomLevel: 9, animated: false)
view.addSubview(mapView)
let annotation = MGLPointAnnotation()
annotation.coordinate = CLLocationCoordinate2D(latitude: 40.77014, longitude: -73.97480)
mapView.addAnnotation(annotation)
mapView.delegate = self
}
func mapView(_ mapView: MGLMapView, viewFor annotation: MGLAnnotation) -> MGLAnnotationView? {
print("CORDINATE")
print(annotation.coordinate)
if annotation is MGLPointAnnotation {
print("SET\n\n\n")
let av = RoundedAnnotationView(annotation: annotation, reuseIdentifier: "ResuseIdentifier")
av.configure()
return av
}
return nil
}
}
class RoundedAnnotationView: MGLAnnotationView{
func configure(){
backgroundColor = .blue
layer.cornerRadius = 24
clipsToBounds = true
}
}
Output:
iPhone_Screen
print_statements
The standard default annotation is being shown in NY because that is exactly what you are adding to the map in setupMapview. If you want the map to display the user's location, you have to tell it to do so:
mapView.addAnnotation(annotation)
mapView.showsUserLocation = true // This needs to be set explicitly.
mapView.delegate = self
As usual, when you want to have access to the user's location you have to ask permission by inserting the correct flag in the info.plist:
Privacy - Location When In Use Usage Description
along with some kind of explanatory string:
"We'd like to track you with our satellite."
If you are running your app on the simulator you can create a custom location:
Simulator -> Features -> Location -> Custom Location...
Annotations should be added after the map has completely loaded. I have a more detailed step by step solution: https://github.com/mapbox/mapbox-gl-native/issues/16492
I have a MapView in SwiftUi and I am trying to add a pin annotation to it when a user long presses a location on the map. I see this can easily be accomplished in swift however I am using SwiftUI. I do not know how to add the long-press detector. A code example would be great.
My MapView
struct MapView: UIViewRepresentable {
#Binding
var annotations: [PinAnnotation]
let addAnnotationListener: (PinAnnotation) -> Void
func makeUIView(context: Context) -> MKMapView {
let mapView = MKMapView()
mapView.delegate = context.coordinator
return mapView
}
func updateUIView(_ view: MKMapView, context: Context) {
view.delegate = context.coordinator
view.addAnnotations(annotations)
if annotations.count == 1 {
let coords = annotations.first!.coordinate
let region = MKCoordinateRegion(center: coords, span: MKCoordinateSpan(latitudeDelta: 0.1, longitudeDelta: 0.1))
view.setRegion(region, animated: true)
}
}
func makeCoordinator() -> MapViewCoordinator {
MapViewCoordinator(self)
}
}
MapViewCoordinator
class MapViewCoordinator: NSObject, MKMapViewDelegate {
var mapViewController: MapView
init(_ control: MapView) {
self.mapViewController = control
}
func mapView(_ mapView: MKMapView, annotationView view: MKAnnotationView, calloutAccessoryControlTapped control: UIControl) {
let annotation = view.annotation
guard let placemark = annotation as? MKPointAnnotation else { return }
}
func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView?{
//Custom View for Annotation
let identifier = "Placemark"
if let annotationView = mapView.dequeueReusableAnnotationView(withIdentifier: identifier) {
annotationView.annotation = annotation
return annotationView
} else {
let annotationView = MKPinAnnotationView(annotation: annotation, reuseIdentifier: identifier)
annotationView.isEnabled = true
annotationView.canShowCallout = true
let button = UIButton(type: .infoDark)
annotationView.rightCalloutAccessoryView = button
return annotationView
}
}
}
The method to add a pin to a MapView
func addPinBasedOnGesture(gestureRecognizer:UIGestureRecognizer){
var touchPoint = gestureRecognizer.locationInView(mapView)
var newCoordinates = self.convertPoint(touchPoint, toCoordinateFromView: mapView)
let annotation = MKPointAnnotation()
annotation.coordinate = newCoordinates
mapView.addAnnotation(annotation)
}
Below solution adds a pin at the point where user long presses on the Map.
Add below method in MapViewCoordinator
#objc func addPinBasedOnGesture(_ gestureRecognizer:UIGestureRecognizer) {
let touchPoint = gestureRecognizer.location(in: gestureRecognizer.view)
let newCoordinates = (gestureRecognizer.view as? MKMapView)?.convert(touchPoint, toCoordinateFrom: gestureRecognizer.view)
let annotation = PinAnnotation()
guard let _newCoordinates = newCoordinates else { return }
annotation.coordinate = _newCoordinates
mapViewController.annotations.append(annotation)
}
and longPress gesture code in func makeUIView(context: Context) -> MKMapView {}
func makeUIView(context: Context) -> MKMapView {
let mapView = MKMapView()
mapView.delegate = context.coordinator
let longPressed = UILongPressGestureRecognizer(target: context.coordinator,
action: #selector(context.coordinator.addPinBasedOnGesture(_:)))
mapView.addGestureRecognizer(longPressed)
return mapView
}
Find below modified parts of provided code to get required behaviour:
struct SUMapView: UIViewRepresentable {
// ... other your code here
func makeUIView(context: Context) -> MKMapView {
let mapView = MKMapView()
mapView.delegate = context.coordinator
let longPressed = UILongPressGestureRecognizer(target:
context.coordinator, action: #selector(addPin(gesture:)))
mapView.addGestureRecognizer(longPressed)
return mapView
}
// ... other your code here
}
class MapViewCoordinator: NSObject, MKMapViewDelegate {
// ... other your code here
#objc func addPin(gesture: UILongPressGestureRecognizer) {
// do whatever needed here
}
// ... other your code here
}
After implementing a way to cluster customised annotations, the application crashes whenever the view of the map is adjusted rapidly, by scrolling or changing the zoom-level.
-[MKPointAnnotation memberAnnotations]: unrecognized selector sent to instance 0x281396c00
My guess is that the compiler is trying to retrieve the annotation information, but cannot find the data. As I'm fairly new to Swift, I don't see what I'm missing. Your help would be greatly appreciated.
I have a pretty basic setup to display the map in SwiftUI. In the main file, I call the MapView from MapView.swift
struct MapView: UIViewRepresentable {
#ObservedObject var store = DataStoreMap()
func makeCoordinator() -> MapViewCoordinator {
MapViewCoordinator(self)
}
func makeUIView(context: Context) -> MKMapView{
MKMapView(frame: .zero)
}
func updateUIView(_ view: MKMapView, context: Context){
let location = getUserLocation()
let chargers = store.chargers
let coordinate = CLLocationCoordinate2D(latitude: location.latitude, longitude: location.longitude)
let span = MKCoordinateSpan(latitudeDelta: 0.03, longitudeDelta: 0.03)
let region = MKCoordinateRegion(center: coordinate, span: span)
view.setRegion(region, animated: true)
for charger in chargers {
let annotation = MKPointAnnotation()
annotation.coordinate = CLLocationCoordinate2D(latitude: charger.addressInfo.latitude, longitude: charger.addressInfo.longitude)
view.delegate = context.coordinator
view.addAnnotation(annotation)
}
}
}
Also included in the same file is my custom annotation class.
class MapViewCoordinator: NSObject, MKMapViewDelegate {
var mapViewController: MapView
init(_ control: MapView) {
self.mapViewController = control
}
func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
//Custom View for Annotation
var annotationView = MKMarkerAnnotationView()
annotationView.canShowCallout = true
let identifier = "laadpaal"
if let dequedView = mapView.dequeueReusableAnnotationView(withIdentifier: identifier) as? MKMarkerAnnotationView {
annotationView = dequedView
} else {
annotationView = MKMarkerAnnotationView(annotation: annotation, reuseIdentifier: identifier)
}
annotationView.markerTintColor = .some(.systemBlue)
annotationView.glyphImage = UIImage(named: "car1")
annotationView.glyphTintColor = .yellow
annotationView.clusteringIdentifier = identifier
return annotationView
}
}
The cause for your crash is that you don't account for other annotations requested by map kit (e.g. MKUserLocation). You are triggering this due to the automatic clustering as you set clusteringIdentifier to a non-nil value.
Just return nil when you want to deal with the annotation yourself so MKMapView uses the default handling:
func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
if annotation is MKUserLocation { return nil }
if annotation is MKClusterAnnotation { return nil }
let view = mapView.dequeueReusableAnnotationView(withIdentifier: "identifier", for: annotation)
view.clusteringIdentifier = "clusterIdentifer"
// …
return view
}
If you ever want to customize the cluster annotations just add a special case for MKClusterAnnotation. And if you show user location don't forget to return nil for MKUserLocation if you want the default blue dot.
I'm trying to set a custom callout view with a xib I created however it doesn't show up.
My xib LocationInfo looks like this
I've created a custom uiview class for the view in my xib to set a background image (not sure if this works since I haven't been able to show the xib)
import Foundation
import UIKit
import MapKit
class AddressView: MKPinAnnotationView{
override func draw(_ rect: CGRect) {
super.draw(rect);
UIGraphicsBeginImageContext(self.frame.size)
UIImage(named: "Location.Info-background")?.draw(in: self.bounds)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
self.backgroundColor = UIColor(patternImage: image!)
}
override func setSelected(_ selected: Bool, animated: Bool) {
//todo
}
override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
//todo
return nil
}
}
My custom annotationpin class is as follows
import Foundation
import MapKit
import UIKit
class MapPin: MKPointAnnotation{
var name: String
var street: String
var type: String
var postCode: String
init(name: String, street: String, type: String, postCode: String){
self.name = name
self.street = street
self.type = type
self.postCode = postCode
}
}
and I'm trying to use this all as follows in my view controller class
func locationManager(_ manager: CLLocationManager, didUpdateLocations locations: [CLLocation]) {
CLGeocoder().reverseGeocodeLocation(manager.location!) { (placemarks, error) in
if (error != nil){
return
}
if placemarks?.count != nil{
let pm = (placemarks?[0])! as CLPlacemark
self.displayLocationInfo(placemark: pm)
}
}
let spanX = 0.00725
let spanY = 0.00725
locationManager.stopUpdatingLocation()
let location = locations.last! as CLLocation
let center = CLLocationCoordinate2D(latitude: location.coordinate.latitude, longitude: location.coordinate.longitude)
let region = MKCoordinateRegion(center: center, span: MKCoordinateSpan(latitudeDelta: spanX, longitudeDelta: spanY))
self.MapRSR.setRegion(region, animated: true)
self.MapRSR.delegate = self
let mapPin = MapPin(name: "", street: "", type: "", postCode: "")
mapPin.coordinate = center
mapPin.title = "test"
self.MapRSR.addAnnotation(mapPin)
}
func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
let pin = mapView.dequeueReusableAnnotationView(withIdentifier: "LocationInfo") ?? AddressView(annotation: annotation, reuseIdentifier: "LocationInfo")
pin.canShowCallout = true
return pin
}
It just won't show my xib view. Does anyone know what I'm doing wrong or how I can achieve the effect I want which is something like this.
In didSelectAnnotationView load xib from bundle and add subview to the annotation view. here CustomXibCallout is xib file and CustomCalloutView is MKAnnotationView.
func mapView(mapView: MKMapView, didSelectAnnotationView view: MKAnnotationView) {
if view.annotation!.isKindOfClass(MKUserLocation){
return
}
//Custom xib
let customView = (NSBundle.mainBundle().loadNibNamed("CustomXibCallout", owner: self, options: nil))[0] as! CustomCalloutView;
let calloutViewFrame = customView.frame;
customView.frame = CGRect(x: -calloutViewFrame.size.width/2.23, y: -calloutViewFrame.size.height-7, width: 315, height: 200)
view.addSubview(customView)
}
in didDeselectAnnotationView remove the added view
func mapView(mapView: MKMapView, didDeselectAnnotationView view: MKAnnotationView)
{
for childView:AnyObject in view.subviews{
childView.removeFromSuperview();
}
}
Example for CustomCallout
I'm looking create this map inside a UIView. Would this be possible? If so can you tell me how I can take this code to a UIView from UIViewController. I'm trying to put a MapBox map into a UIView and there are only instructions on how to import it into a UIViewController
How would this code look as a UIView class:
import Mapbox
class mapboxMap: UIViewController, MGLMapViewDelegate {
var mapView: MGLMapView!
override func viewDidLoad() {
super.viewDidLoad()
mapView = MGLMapView(frame: view.bounds)
mapView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
// set the map's center coordinate
mapView.setCenterCoordinate(CLLocationCoordinate2D(latitude: 40.7326808,
longitude: -73.9843407),
zoomLevel: 10, animated: false)
view.addSubview(mapView)
// Set the delegate property of our map view to self after instantiating it.
mapView.delegate = self
// Declare the marker `hello` and set its coordinates, title, and subtitle
let hello = MGLPointAnnotation()
hello.coordinate = CLLocationCoordinate2D(latitude: 40.7326808, longitude: -73.9843407)
hello.title = "Hello world!"
hello.subtitle = "Welcome to my marker"
mapView.addAnnotation(hello)
let hello2 = MGLPointAnnotation()
hello2.coordinate = CLLocationCoordinate2D(latitude: 40.7526808, longitude: -73.9843407)
hello2.title = "Hello world!"
hello2.subtitle = "Welcome to my marker"
mapView.addAnnotation(hello2)
}
// Use the default marker; see our custom marker example for more information
func mapView(mapView: MGLMapView, imageForAnnotation annotation: MGLAnnotation) -> MGLAnnotationImage? {
return nil
}
func mapView(mapView: MGLMapView, annotationCanShowCallout annotation: MGLAnnotation) -> Bool {
return true
}
override func viewDidAppear(animated: Bool) {
// Wait a bit before setting a new camera.
// Create a camera that rotates around the same center point, back to 0°.
// `fromDistance:` is meters above mean sea level that an eye would have to be in order to see what the map view is showing.
let camera = MGLMapCamera(lookingAtCenterCoordinate: mapView.centerCoordinate, fromDistance: 9000, pitch: 45, heading: 0)
// Animate the camera movement over 5 seconds.
mapView.setCamera(camera, withDuration: 2.5, animationTimingFunction: CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut))
}
}
I think what you are trying to do is "add UIViewController in subview". Try to use Container view Controller. And following thread may helpful to you.
add UIViewController in subview