Fully customize Apple Maps appearance on all iDevices

Sandro Wehrhahn
the peak lab.
Published in
2 min readJul 12, 2018
Credit: the peak lab.

At the peak lab. we are focused on building great apps. Not only technical wise, but also with regards to the design and overall look and feel of what we create. When it comes to integrating MapViews into our apps for example, we want them to blend in perfectly with our app designs. Unfortunately — as you may know — Apple Maps is not directly customizable and can only be used “as is” within apps. We think that’s a pity!

Of course there are already several frameworks out there — like Mapbox for example — that allow you to integrate maps with custom designs in your apps. But in our native iOS Development we strive to minimize external dependencies in order to get the best possible performance. That’s why we came up with the following idea:

Our Goal

  • We want to use the native MKMapView from Apples MapKit framework
  • We want to apply our own design to the MapView
  • It should be usable on all Apple Devices
  • It should be easy to use

Our Solution

During our research process, we stumbled across this wonderful and very helpful article from Fernando Martín Ortiz. It is a great “how to” manual for customizing Apple Maps. If you want to learn more about the basics of TileOverlays and the Google ApiStyle you should definitely check out his article:

https://medium.com/@ortizfernandomartin/customize-mapkits-mkmapview-with-google-maps-styling-wizard-a5dcc095e19f

Google Map Styling Wizard / Credit: the peak lab.

Based on his framework, we were able to build a similar one but with some additional benefits. And here is how it works:

  1. Create a mapstyle with the Google Map Style Wizard. The wizard is pretty powerful but easy to use
  2. Save your style as a JSON-File and add it to your Xcode project
  3. Integrate our GoogleMapsTileOverlay Framework using Carthage
  4. Instantiate a GoogleMapsTileOverlay with the JSON-File and add it to your MapView

What are the benefits to other Map Frameworks?

  • You can change the style at runtime
  • There are no fees and you do not need API-Keys
  • You don’t have to change your existing Apple Maps code

If you’d like to use our framework please follow the instructions on our Github repository: https://github.com/thepeaklab/GoogleMapsTileOverlay

You can use it either on iOS, tvOS & macOS

Thanks for reading! 🌎

--

--