How to Scale a Image 1:1 in Apple Maps

Question

I need to scale an image/icon 1:1 in Apple Maps. Cannot find any Information about that topic on the Internet.

The Idea is to place a simple jpg as an UIImageView over the MKMapView . but if there is a other way please let me know

Just to be clear, I need to put the image in relation to the zoom level of the map. For example, show objects like a cat ;) or a tree in real size at the map. At the first step, the object should stay in the middle of the screen, so I can rotate and rearrange the map lying underneath. Later on a like to pin the object to the map.

can you please clarify your question and add some code snippets of your current attempt? Without more information it is hard to say what you're trying to achieve — Andras M., Nov 25 '19 at 09:48
Please provide further info, such as... Do you mean add an image to the mapview such that it preserves its aspect ration? Does the image need to be tied to a location on the map? — flanker, Nov 25 '19 at 09:58

lobax · Accepted Answer · 2019-12-02T10:32:08.983

I finally came up with something like this:

class MapViewController: UIViewController {

    @IBOutlet weak var mapView: MKMapView!

    override func viewDidLoad() {
        super.viewDidLoad()        
        mapView.delegate = self

        draw()
    }

    func draw() {

        let region = mapView.region
        let center = region.center

        let pointsPerMeter = MKMapPointsPerMeterAtLatitude(center.latitude)

        // Real-World-Object with 24 Meters length and 4 Meters width
        let objectLength = pointsPerMeter*24
        let objectWidth = pointsPerMeter*4
        let mapSize = MKMapSize.init(width: objectLength, height: objectWidth)
        let mapPoint = MKMapPoint.init(center)
        let objectRect = MKMapRect.init(origin: mapPoint, size: mapSize)

        // clear the map
        mapView.removeOverlays(mapView.overlays)

        // create image overlay from Real-World-Object
        let objectOverlay = ImageOverlay(image: UIImage(named: "nameOfYourImageAsset")!, rect: objectRect.offsetBy(dx: -objectLength/2 , dy: -objectWidth/2))

        // add overlay to map
        mapView.addOverlay(objectOverlay)

    }

}

// found here https://stackoverflow.com/a/45989625/10878331
class ImageOverlay : NSObject, MKOverlay {
    let image:UIImage
    let boundingMapRect: MKMapRect
    let coordinate:CLLocationCoordinate2D

    init(image: UIImage, rect: MKMapRect) {
        self.image = image
        self.boundingMapRect = rect
        self.coordinate = rect.origin.coordinate
    }
}

class ImageOverlayRenderer : MKOverlayRenderer {
    override func draw(_ mapRect: MKMapRect, zoomScale: MKZoomScale, in context: CGContext) {

        guard let overlay = self.overlay as? ImageOverlay else {
            return
        }

        let rect = self.rect(for: overlay.boundingMapRect)

        UIGraphicsPushContext(context)
        overlay.image.draw(in: rect)
        UIGraphicsPopContext()
    }
}

The Code isn't beauty yet, nor is it optimal, but it kind of works I guess. I assume that you already have your user location or any point so mapView.region has a valid value.

The Code is still in progress. I will try to put a simple UIImage on top of the map which i hopefully can put into context of the map. I guess I need to set mapView.isZoomEnabled = false for ease

score -2 · Answer 2 · answered Nov 25 '19 at 09:46

-2

sir

YOu can jus simply drag UIImageTo your storyboard and set width or high to your image and then set aspect ratio 1:1 (Just press control button and drag line from your image view to your image view and then press option to se that option)

Or you can do it programmatically

Have a nice day

answered Nov 25 '19 at 09:46

Maksim Chizhavko

137
5

sorry was a bit misleading. I need to put the image in relation to the zoom level of the map ... will update my question – lobax Nov 25 '19 at 09:58
You can show image depend on level of zoom on your MapView Check that page https://developer.apple.com/documentation/mapkit/mkmapviewdelegate – Maksim Chizhavko Nov 25 '19 at 10:45

How to Scale a Image 1:1 in Apple Maps

2 Answers2