{% extends "main.html" %} {% block javascript %} mapboxgl.accessToken = '{{ accessToken }}'; var map = new mapboxgl.Map({ container: 'map', attributionControl: false, style: {{ style }}, center: {{ center }}, zoom: {{ zoom }}, pitch: {{ pitch }}, bearing: {{ bearing }}, scrollZoom: {{ scrollZoomOn|safe }}, touchZoom: {{ touchZoomOn|safe }}, doubleClickZoom: {{ doubleClickZoomOn|safe }}, boxZoom: {{ boxZoomOn|safe }}, transformRequest: (url, resourceType) => { if ( url.slice(0,22) == 'https://api.mapbox.com' || url.slice(0,26) == 'https://a.tiles.mapbox.com' || url.slice(0,26) == 'https://b.tiles.mapbox.com' || url.slice(0,26) == 'https://c.tiles.mapbox.com' || url.slice(0,26) == 'https://d.tiles.mapbox.com') { //Add Mapboxgl-Jupyter Plugin identifier for Mapbox API traffic return { url: [url.slice(0, url.indexOf("?")+1), "pluginName=PythonMapboxgl&", url.slice(url.indexOf("?")+1)].join('') } } else { //Do not transform URL for non Mapbox GET requests return {url: url} } }, }); {% block attribution %} map.addControl(new mapboxgl.AttributionControl({ compact: true })); {% endblock attribution %} {% block navigation %} map.addControl(new mapboxgl.NavigationControl()); {% endblock navigation %} {% block legend %}{% endblock legend %} {% block map %}{% endblock map %} {% endblock %}