-
Notifications
You must be signed in to change notification settings - Fork 135
/
heatmap.html
54 lines (45 loc) · 1.57 KB
/
heatmap.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
{% extends "main.html" %}
{% block javascript %}
mapboxgl.accessToken = '{{ accessToken }}';
var map = new mapboxgl.Map({
container: 'map',
style: {{ style }},
center: {{ center }},
zoom: {{ zoom }},
transformRequest: (url, resourceType)=> {
if ( url.slice(0,22) == 'https://api.mapbox.com' ) {
//Add Python 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}
}
}
});
map.addControl(new mapboxgl.NavigationControl());
document.getElementById('legend').style.visibility = 'hidden';
map.on('style.load', function() {
map.addSource("data", {
"type": "geojson",
"data": {{ geojson_data }}, //data from dataframe output to geojson
"buffer": 0,
"maxzoom": 14
});
map.addLayer({
"id": "circle",
"source": "data",
"type": "heatmap",
"maxzoom": {{ maxzoom }},
"minzoom": {{ minzoom }},
"paint": {
"heatmap-weight": generateInterpolateExpression( "{{ weightProperty }}", {{ weightStops }} ),
"heatmap-radius" : generateInterpolateExpression('zoom', {{ radiusStops }} ),
"heatmap-color" : generateInterpolateExpression('heatmap-density', {{ colorStops }} ),
"heatmap-opacity" : {{ opacity }}
}
}, "{{belowLayer}}" );
});
{% endblock %}