Use Atlas with other Mapbox products

To build with Mapbox GL JS and other Mapbox products and to serve your Atlas maps, you will need the Atlas token that you created as part of the installation process. This Atlas public token is unique to your Atlas instance, and will not work on Mapbox.com.

Available Mapbox APIs

With Mapbox Atlas, you can use the following Mapbox APIs offline:

Right now, Atlas only supports calls to these APIs that require public access (pk) tokens. For example, it's not possible to programmatically create, edit, or delete map styles using the Styles API since these calls require a secret access (sk) token, but you can do all these functions with the Atlas instance of Mapbox Studio.

Use Mapbox GL JS with Atlas

Note: Atlas supports Mapbox GL JS versions 0.40 through 0.54.

To use a Mapbox GL JS application with Atlas, make the following changes to the relevant files:

  1. Update mapboxgl.accessToken to a public access token created on your Atlas Studio Account page.
  2. Set mapboxgl.config.API_URL = '<your-atlas-url>'; within your application.
  3. Update the mapbox-gl-js library URLs in your HTML:
<script src='<your-atlas-url>/mapbox-gl-js/v0.46.0/mapbox-gl.js'></script>
<link href='<your-atlas-url>/mapbox-gl-js/v0.46.0/mapbox-gl.css' rel='stylesheet' />

If you use additional APIs in your application, you need to make sure that all APIs have been updated to the appropriate Atlas URL instead of the default api.mapbox.com.

Looking for inspiration? You can use Mapbox GL JS examples as a baseline to build off of, then make the above changes for working with Atlas.

Use Mapbox.js with Atlas

Note: Atlas supports Mapbox.js versions 2.0 through 3.1. While Mapbox.js is stable, it is not in active development. We recommend you to use Mapbox GL JS instead if possible.

Mapbox Studio styles with L.mapbox.styleLayer are supported when you use Mapbox.js with Atlas. Mapbox Studio Classic styles are not supported.

To use a Mapbox.js application with Atlas, make the following changes to your file:

  1. Update L.mapbox.accessToken to a public access token created on your Atlas Studio Account page.
  2. Update L.mapbox.config.HTTPS_URL to set the appropriate hostname and port for your Atlas installation.
  3. Use L.mapbox.styleLayer to set the style.

    • For example: L.mapbox.styleLayer('mapbox://styles/mapbox/streets-v10').addTo(map);
  4. Update the mapbox.js library URLs in your HTML:
<script src='https://<your-atlas-url>/mapbox.js/v3.1.1/mapbox.js'></script>
<link href='https://<your-atlas-url>/mapbox.js/v3.1.1/mapbox.css' rel='stylesheet' />

If you use additional APIs in your application, you need to make sure that all APIs have been updated to the appropriate Atlas URL instead of the default api.mapbox.com.

Use mobile and AR SDKs with Atlas

Atlas maps can also be used in mobile apps that use the Mapbox Android Maps SDK or the iOS Maps SDK, or in AR apps that use the Mapbox Unity SDK. You can make all apps that work on Mapbox.com also work with Atlas using the proper app configuration.

Static examples

Your Atlas installation comes with two static map examples that you can use for reference as you create your own Atlas maps. There is a vector map example used in a webpage powered by Mapbox GL JS, and a raster map example in a page powered by Mapbox.js. The HTML for both of these files is in the /static directory. To view these examples:

  1. Open the example HTML file in a text editor like Atom or Sublime.

    • For Mapbox GL JS: /atlas-server/static/index.html
    • For Mapbox.js: /atlas-server/static/mapbox-js.html
  2. In the JavaScript and CSS scripts in the header of the HTML file, update http://localhost:2999 to match your Atlas configuration.
  3. Remove the token placeholder text (your-atlas-studio-token) and replace it with your public pk access token. (Your public token is located on your Atlas account dashboard.) The token should be in quotation marks.
  1. Open the sample file in a browser to view the static map example.