Skip to main content

Apple Maps now available to embed into websites with MapKit JS

The Apple Maps app didn’t get any major changes in iOS 12, but the MapKit team announced at WWDC that they are officially launching MapKit as a web framework for others to use. Google Maps is incredibly popular as an embedded map for other web services, and now Apple is trying to take a slice of that pie. MapKit JS is the same map component that Apple uses in many of its web properties, including Find My iPhone on, and the WWDC 2018 site.

The Apple MapKit JS library is launching in beta this week. It mirrors the MapKit API available to native iOS apps, with Apple Maps iconic cartography and data sources.

We first discovered the MapKit JS API on the WWDC website back in 2016. It took a couple of years, but it is now available for wider consumption.

As you might expect from an Apple framework, MapKit JS is tuned to behave well on mobile and desktop platforms. Users can use the same gestures they would be accustomed to from a native maps experience, like pinch-to-zoom and tilt to change perspective.

MapKit prefers to render map cartography as vectors using WebGL, which closely mirrors how native Apple Maps look. However, it can gracefully degrade to a rasterised image tile approach on older hardware. On the implementation side, embedding a simple map requires just a few lines of code to insert into a page.

Whilst its hard to see Google Maps being unseated as the go-to solution for this kind of thing, MapKit JS allows developers to provide the same UI and map data for services available on iOS and the web.

Features like annotations and overlays are exposed for advanced customisation of map display, and the API also allows developers to integrate Apple Maps directions and routing into their web apps. You can see an example implementation here, of a third-party using the MapKit JS API to highlight a particular region.

For the beta period, MapKit JS has usage limits of 250,000 instantiations, and 25,000 service calls, per API key per day. This is pretty competitive pricing. For a comparison, the Google Maps API only allows for around 100,000 map instantiations per month on the free plan. Apple says companies can contact them to negotiate rates if the free limits exceed their needs.

Find out more about MapKit JS here.

Check out 9to5Mac on YouTube for more Apple news:

FTC: We use income earning auto affiliate links. More.

You’re reading 9to5Mac — experts who break news about Apple and its surrounding ecosystem, day after day. Be sure to check out our homepage for all the latest news, and follow 9to5Mac on Twitter, Facebook, and LinkedIn to stay in the loop. Don’t know where to start? Check out our exclusive stories, reviews, how-tos, and subscribe to our YouTube channel