Render Mapbox styles in mobile, desktop, and node applications using C++ and OpenGL
Switch branches/tags
Clone or download
Pull request Compare This branch is 7 commits ahead, 2541 commits behind mapbox:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
mapbox-gl-js @ 8b085a2

Mapbox GL Native

A library for embedding interactive, customizable vector maps into native applications on multiple platforms. It takes stylesheets that conform to the Mapbox Style Specification, applies them to vector tiles that conform to the Mapbox Vector Tile Specification, and renders them using OpenGL. Mapbox GL JS is the WebGL-based counterpart, designed for use on the Web.

Mapbox GL + WebP for iOS

This branch is to demonstrate and document source code on how to use Mapbox GL + WebP for iOS.

For the Cleveland National Forest map, "raster tiling with lossless PNG" created map data of 103 MB. "Raster tiling using WebP", covering the same region, and the same zoom level created map data of 34 MB. A reduction in size of 66 MB!!

Given that iOS Apps are capped at 100 MB... we at the Rob Labs are bullish on WebP.

This demo is based on the mapbox-gl-native tag ios-v3.6.0

WebP as a mason package

Ideally, WebP should be compiled using the mapbox/mason architecture. cf. #450

iOS Demo

  • The base layer map for this Cleveland National Forest map is WebP at zoom level 14.


WebP as a framework via Mason

We use the Mason framework to pull in WebP.

These notes are here to describe how WebP was originally brought into mapbox-gl-native

You can also use the precompiled WebP framework downloaded from the WebP source.

  1. Add WebP support based on discussion of mapbox/mapbox-gl-native #3572 and the branch webp-darwin
  2. - See
  3. - See image.cpp
  4. - Add WebP.framework to platform/ios
  5. make clean
  6. make iproj
  7. - Update the Headers Search path. See the file config.cmake
  8. ⚠️ - Manually add WebP to build/ios/mbgl.xcodeproj- *
  9. Open the mbgl-core target in Xcode
  10. Build Phases > + > New Link Binary with Libraries Phase
  11. + > Add others... > Navigate to WebP.framework
  12. make ipackage
Emoji Interpreter

= already done for you

⚠️ = manual step

Testing WebP on Mapbox GL for iOS

  1. To test WebP tiles, you can base your style on these examples of PNG and other tiles
  "version": 8,
  "sources": {
    "webp-tiles": {
      "type": "raster",
      "url": "http://RobLabs.server/webp/raster/{z}/{x}/{y}.webp",
      "tileSize": 512
  "layers": [
      "id": "webp-tiles-id",
      "type": "raster",
      "source": "webp-tiles"

The Mapbox GL ecosystem

This repository hosts the cross-platform Mapbox GL Native library, plus convenient SDKs for several platforms. The cross-platform library comes with a GLFW-based demo application for Ubuntu Linux and macOS. The SDKs target the usual languages on their respective platforms:

SDK Languages Build status
Mapbox GL Native C++14 Travis Coverage Status
Mapbox Android SDK Java Bitrise
Mapbox iOS SDK Objective-C or Swift Bitrise
Mapbox macOS SDK Objective-C, Swift, or AppleScript Bitrise
node-mapbox-gl-native Node.js Linux macOS
Mapbox Qt SDK C++03 Travis Bitrise

Additional Mapbox GL Native–based libraries for hybrid applications are developed outside of this repository:

Toolkit Android iOS Developer
React Native (npm)
Apache Cordova (npm) Telerik
NativeScript (npm) Telerik
Xamarin Xamarin

If your platform or hybrid application framework isn’t listed here, consider embedding Mapbox GL JS using the standard Web capabilities on your platform.