-
Notifications
You must be signed in to change notification settings - Fork 0
/
cesium-mapbox-icgc.html
85 lines (71 loc) · 3.41 KB
/
cesium-mapbox-icgc.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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<html lang="es">
<head>
<title>Ejemplo Cesium con Mapbox e ICGC</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="autor" />
<meta name="description" content="descripción página">
<meta name="robots" content="index,follow">
<script src="https://cesiumjs.org/releases/1.53/Build/Cesium/Cesium.js"></script>
<link href="https://cesiumjs.org/releases/1.53/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
#map {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
margin: 0;
overflow: hidden;
padding: 0;
}
body {
padding: 0;
margin: 0;
overflow: hidden;
height: 100%;
}
</style>
<script>
function Init() {
/*
var imageReference = new Cesium.UrlTemplateImageryProvider({
url: 'https://api.mapbox.com/styles/v1/marcrb3/cjrql9wgldozd2toc9yhs4362/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFyY3JiMyIsImEiOiJjanJqanZvMXowYzdnNDRsbGN4N3JyMGhuIn0.im2TOkqyqEpCXhN4LWoZuA',
});
*/
var imageReference=new Cesium.createOpenStreetMapImageryProvider({
url: 'https://geoserveis.icgc.cat/icc_mapesmultibase/noutm/wmts/orto/GRID3857/',
fileExtension: 'jpeg',
maximumLevel: 19,
credit: 'Institut Cartogràfic i Geològic de Catalunya'
});
Cesium.Ion.defaultAccessToken =
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJhMTI3Mjk3ZC02NzgwLTRmNDEtODc2MC0yM2YzNWU3MTExMWUiLCJpZCI6NzQ2Miwic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0OTQ3MTE3MH0.owdFizYRnPR2G7pOXSRxZGBJQsoMxp0wxYMtWFycrcc';
map = new Cesium.Viewer('map', {
imageryProvider: imageReference,
timeline: false,
navigationHelpButton: true,
scene3DOnly: true,
fullscreenButton: true,
baseLayerPicker: false,
homeButton: false,
infoBox: true,
sceneModePicker: false,
animation: false,
geocoder: false,
sceneMode: Cesium.SceneMode.SCENE3D,
terrainProvider: Cesium.createWorldTerrain()
});
map.camera.flyTo({
destination: Cesium.Cartesian3.fromDegrees(2.1806, 41.4003, 15000),
orientation: {
pitch: Cesium.Math.toRadians(-45.0)
},
});
};
</script>
</head>
<body onload="Init()">
<div id="map"></div>
</body>
</html>