Apple Maps now available to embed into websites with MapKit JS

Apple Maps now available to embed into websites with MapKit JS

SHARE

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 iCloud.com, 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.