MKOverlayRenderer for NOAA radar image not displaying properly (stretched)

112 Views Asked by At

Im trying to display a NOAA radar image into my MapView using a subclassed MKOverlay in conjunction with a subclassed MKOverlayRenderer. Ive looked at several other links and have tried several methods but I either dont get any image at all (because the mapRect isnt proper) or the image that I do get is stretched up into Canada and down into South America. I believe the east/west is ok.

Can someone point me to the solution? It appears to be an issue with the mapRect in my renderer but after a few hours of trying various things I have yet to solve it.

Here's the links Ive looked at so far:

MKOverlayRenderer stretches image

Proper use of MKOverlayView

MapKit Adding Raster Map via MKOverlay Weird Rendering Issue

Thank you!

method to invoke the display:

func loadRadarImage()
{
    let center = CLLocationCoordinate2D(latitude: 47.6062, longitude: -122.3320)
    let overlay = RadarOverlay(coord: center, rect: self.mapView.visibleMapRect)

    self.mapView.addOverlay(overlay, level: .aboveRoads)
}

MKOverlay:

class RadarOverlay: NSObject, MKOverlay {

    var coordinate: CLLocationCoordinate2D
    var boundingMapRect: MKMapRect

    init(coord: CLLocationCoordinate2D, rect: MKMapRect) {
        self.coordinate = coord
        self.boundingMapRect = rect
    }
}

MKOverlayRenderer:

@objcMembers
class NOAAMapOverlayRenderer : MKOverlayRenderer
{
    var radarImage : UIImage?

    init(overlay: MKOverlay, overlayImage: UIImage)
    {
        self.radarImage = overlayImage

        super.init(overlay: overlay)
    }

    override func draw(_ mapRect: MKMapRect, zoomScale: MKZoomScale, in context: CGContext)
    {
        if let mapImage = self.radarImage?.cgImage
        {
            let mapRect = rect(for: overlay.boundingMapRect) // CGRect
            context.scaleBy(x: 1.0, y: -1.0)
            context.translateBy(x: 0.0, y: CGFloat(-mapRect.size.height))
            context.draw(mapImage, in: mapRect)
        }
    }
}

Produces This:

enter image description here

1

There are 1 best solutions below

2
matt On

There is a typological mismatch here:

RadarOverlay(coord: center, rect: self.mapView.visibleMapRect)

You are saying that that is where the radar image should be. But how do you know? I don't see you consulting the radar image to find out what region it portrays.