--- layout: pages class: fill-light options: full ---

Mapbox GL JS

Mapbox GL JS is a JavaScript library that uses WebGL to render interactive maps from vector tiles and Mapbox GL styles

It is part of the Mapbox GL ecosystem which includes Mapbox Mobile, a compatible renderer written in C++ with bindings for desktop and mobile platforms.

Mapbox GL JS gallery

Using Mapbox GL JS with a <script> tag

To use the vector tiles and styles hosted on Mapbox, you must create an account and obtain an access token. You can learn more about access tokens here.

<!DOCTYPE html>
<html>
<head>
  <script src='https://api.tiles.mapbox.com/mapbox-gl-js/{{site.version}}/mapbox-gl.js'></script>
  <link href='https://api.tiles.mapbox.com/mapbox-gl-js/{{site.version}}/mapbox-gl.css' rel='stylesheet'>
</head>

<body>
  <div id='map' style='width: 400px; height: 300px;' />

  <script>
    mapboxgl.accessToken = '<your access token here>';
    var map = new mapboxgl.Map({
      container: 'map',
      style: 'mapbox://styles/mapbox/streets-v8'
    });
  </script>
</body>
</html>
      
{{ content }}