{"_id":"586d8f521c014819000ea67d","parentDoc":null,"user":"56d62986b30acf150053be43","version":{"_id":"586d8f511c014819000ea65d","project":"56d629f02417921500c46716","__v":2,"createdAt":"2017-01-05T00:12:01.865Z","releaseDate":"2017-01-05T00:12:01.865Z","categories":["586d8f511c014819000ea65e","586d8f511c014819000ea65f","586d8f511c014819000ea660","586d8f511c014819000ea661","586d8f511c014819000ea662","586d8f511c014819000ea663","586d8f511c014819000ea664","587977f57a58130f00303d4e"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"adams","version_clean":"2.0.0","version":"2.0"},"githubsync":"","project":"56d629f02417921500c46716","__v":0,"category":{"_id":"586d8f511c014819000ea663","__v":0,"project":"56d629f02417921500c46716","version":"586d8f511c014819000ea65d","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2016-03-25T01:10:14.029Z","from_sync":false,"order":6,"slug":"integration-examples","title":"Examples"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2016-07-25T21:43:54.809Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"settings":"","results":{"codes":[]},"auth":"required","params":[],"url":""},"isReference":false,"order":9,"body":"You can easily use [DigitalGlobe Maps API](https://developer.digitalglobe.com/maps-api) with [Mapbox GL](https://www.mapbox.com/mapbox-gl-js/api), [Javascript](https://en.wikipedia.org/wiki/JavaScript) library that uses WebGL to render interactive maps from vector tiles and Mapbox [styles](https://www.mapbox.com/mapbox-gl-style-spec). It is part of the [Mapbox GL ecosystem](https://github.com/mapbox/mapbox-gl), which includes [Mapbox Mobile](https://www.mapbox.com/mobile/), a compatible renderer written in C++ with bindings for desktop and mobile platforms.\n\nUsing Maps API with Mapbox GL requires [GL Styles](doc:map-styles) instead of the typical [Map ID](doc:map-id).  To enable access to a GL Style, send us a [quick email](mailto:mapsapi-support:::at:::digitalglobe.com) and we will upgrade your account.\n\nBelow is a javascript snippet detailing how to use Maps API with Mapbox GL:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"mapboxgl.accessToken = 'ENTER YOUR MAPS API ACCESS TOKEN HERE';\\nvar map = new mapboxgl.Map({\\n    container: 'map', // container id\\n    style: 'mapbox://styles/digitalglobe/ciode6t5k0081aqm7k06dod4v', //RECENT IMAGERY\\n    center: [12.486, 41.89], // starting position\\n    zoom: 14 // starting zoom\\n});\\n\\n// Add zoom and rotation controls to the map.\\nmap.addControl(new mapboxgl.Navigation());\",\n      \"language\": \"javascript\"\n    }\n  ]\n}\n[/block]","excerpt":"","slug":"maps-api-mapbox-gl","type":"basic","title":"Maps API + Mapbox GL"}

Maps API + Mapbox GL


You can easily use [DigitalGlobe Maps API](https://developer.digitalglobe.com/maps-api) with [Mapbox GL](https://www.mapbox.com/mapbox-gl-js/api), [Javascript](https://en.wikipedia.org/wiki/JavaScript) library that uses WebGL to render interactive maps from vector tiles and Mapbox [styles](https://www.mapbox.com/mapbox-gl-style-spec). It is part of the [Mapbox GL ecosystem](https://github.com/mapbox/mapbox-gl), which includes [Mapbox Mobile](https://www.mapbox.com/mobile/), a compatible renderer written in C++ with bindings for desktop and mobile platforms. Using Maps API with Mapbox GL requires [GL Styles](doc:map-styles) instead of the typical [Map ID](doc:map-id). To enable access to a GL Style, send us a [quick email](mailto:mapsapi-support@digitalglobe.com) and we will upgrade your account. Below is a javascript snippet detailing how to use Maps API with Mapbox GL: [block:code] { "codes": [ { "code": "mapboxgl.accessToken = 'ENTER YOUR MAPS API ACCESS TOKEN HERE';\nvar map = new mapboxgl.Map({\n container: 'map', // container id\n style: 'mapbox://styles/digitalglobe/ciode6t5k0081aqm7k06dod4v', //RECENT IMAGERY\n center: [12.486, 41.89], // starting position\n zoom: 14 // starting zoom\n});\n\n// Add zoom and rotation controls to the map.\nmap.addControl(new mapboxgl.Navigation());", "language": "javascript" } ] } [/block]