DroneDeploy
Search…
Tiles.get - Render tiles in map
1
<!DOCTYPE html>
2
<html lang="en">
3
<head>
4
<meta charset="UTF-8">
5
<title>Document</title>
6
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
7
integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ=="
8
crossorigin=""/>
9
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
10
integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log=="
11
crossorigin=""></script>
12
<style>
13
#mapid { height: 180px; }
14
</style>
15
</head>
16
<body>
17
18
<div id="mapid"></div>
19
20
<script>
21
var qs = document.querySelector.bind(document);
22
new DroneDeploy({version: 1}).then(function(dronedeploy){
23
var map = L.map('mapid');
24
25
function focusMapOnPlanCenter(plan){
26
map.setView([plan.location.lat, plan.location.lng], 14);
27
return plan;
28
}
29
30
function renderNewTileTemplate(tileTemplate){
31
L.tileLayer(tileTemplate).addTo(map);
32
}
33
34
function getTileTileTemplateFromPlan(plan){
35
return dronedeploy.Tiles.get({planId: plan.id, layerName: 'ortho'})
36
.then(function(tileResponse){
37
return tileResponse.template;
38
});
39
}
40
41
dronedeploy.Plans.getCurrentlyViewed()
42
.then(focusMapOnPlanCenter)
43
.then(getTileTileTemplateFromPlan)
44
.then(renderNewTileTemplate)
45
});
46
</script>
47
48
</body>
49
</html>
Copied!
Last modified 2yr ago
Copy link