thedp
thedp

Reputation: 8508

Is it possible to change Apple Map colors?

I've currently developing an iOS application with a dark theme, and would really like to make the displayed Apple Map also in dark colors.

I've Googled the topic and tried to change the properties of the component through the Storyboard. But, I couldn't find anything.

Is this even possible? Can I change the colors of the Apple Map component... or even just invert the color to make it look dark?

Thank you.

Upvotes: 3

Views: 7983

Answers (3)

mbnz
mbnz

Reputation: 73

You can create a subclass of MKTileOverlay like

class DarkModeMapOverlay: MKTileOverlay {
    init() {
        super.init(urlTemplate: nil)
        canReplaceMapContent = true
    }

    override func url(forTilePath path: MKTileOverlayPath) -> URL {
        let tileUrl = "https://a.basemaps.cartocdn.com/dark_all/\(path.z)/\(path.x)/\(path.y).png"
        return URL(string: tileUrl)!
    }
  }

and then set the overlay on your MKMapView with

class MapViewController: UIViewController, MKMapViewDelegate {
    private var tileRenderer: MKTileOverlayRenderer?

    private var mapView: MKMapView {
        return view as! MKMapView
    }

    private func configureTileRenderer() {
        let darkModeOverlay = DarkModeMapOverlay()
        tileRenderer = MKTileOverlayRenderer(tileOverlay: darkModeOverlay)
        mapView.addOverlay(darkModeOverlay, level: .aboveLabels)
    }

    override func loadView() {
        view = MKMapView(frame: .zero)
    }

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

    // MARK: MKMapViewDelegate
    func mapView(_: MKMapView, rendererFor overlay: MKOverlay) -> MKOverlayRenderer {
        guard let renderer = self.tileRenderer else {
            return MKOverlayRenderer(overlay: overlay)
        }
        return renderer
    }
}

Upvotes: 0

incanus
incanus

Reputation: 5128

You can't do this without using third-party providers like MapBox, at least on iOS 6 and below.

Upvotes: 0

Rob
Rob

Reputation: 437372

It's a little clumsy and limited, but you could put a UIView with black background color and alpha less than 1.0 (e.g. 0.3) over the map (make sure to turn off user interaction with this view so gestures get passed through to the map) and that would dim the whole thing. A little kludgy and you lose contrast, but it might be worth trying.

Upvotes: 1

Related Questions