-
Notifications
You must be signed in to change notification settings - Fork 2
/
index_example.html
120 lines (116 loc) · 4.7 KB
/
index_example.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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1">
<!-- On production systems a Content-Security-Policy and referrer meta-tag should be added, see below.
The CSP should be modified with adding specific sources that should be allowed, f.e. connect-src 'self' webanalysis.example.com geospatialdata.example.com; -->
<!-- <meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src * data:; script-src 'self' 'unsafe-inline' 'unsafe-eval'; connect-src 'self'; style-src 'self' 'unsafe-inline'; style-src-elem 'self' 'unsafe-inline'; base-uri 'self'; form-action 'self';">
<meta name="referrer" content="same-origin"> -->
<title>Origo exempel</title>
<link href="css/style.css" rel="stylesheet">
<link href="plugins/globe/globe.css" rel="stylesheet">
<link rel="shortcut icon" href="img/png/logo.png">
</head>
<body>
<div id="app-wrapper">
</div>
<script src="js/origo.js"></script>
<script src="plugins/globe/globe.js"></script>
<script type="text/javascript">
//Init origo
var origo = Origo('index.json');
origo.on('load', function (viewer) {
var globe = Globe({
showGlobe: true,
globeOnStart: true,
deactivateControls: ["measure"],
settings: {
depthTestAgainstTerrain: true,
enableAtmosphere: true,
enableGroundAtmosphere: true,
enableFog: true,
enableShadows: true,
skyBox: {
url: "plugins/globe/cesiumassets/Assets/Textures/SkyBox/",
images: {
pX: "tycho2t3_80_px.jpg",
nX: "tycho2t3_80_mx.jpg",
pY: "tycho2t3_80_py.jpg",
nY: "tycho2t3_80_my.jpg",
pZ: "tycho2t3_80_pz.jpg",
nZ: "tycho2t3_80_mz.jpg"
}
}
},
// "cesiumIontoken": "Needed if using OSM-Buildings or other Cesium Ion assets",
"cesium3dTiles": [
{
"url": "OSM-Buildings",
"showOutline": true,
"outlineColor": 'AQUA',
"filter": "${feature['elementId']} !== 251329024 && ${feature['elementId']} !== 425027205 && ${feature['elementId']} !== 425002757",
"style": [
[
"${feature['building']} === 'civic' || ${feature['building']} === 'construction' || ${feature['building']} === 'church'",
"color('#ed6258', 1)"
],
[
"${feature['building']} === 'commercial' || ${feature['building']} === 'retail' || ${feature['building']} === 'office'",
"color('#af8b74', 1)"
],
[
"${feature['building']} === 'apartments' || ${feature['building']} === 'residential' || ${feature['building']} === 'house' || ${feature['building']} === 'yes' || ${feature['building']} === 'roof'",
"color('#c98754', 1)"
],
[
"${feature['building']} === 'warehouse' || ${feature['building']} === 'manufacture' || ${feature['building']} === 'industrial'",
"color('#919494', 1)"
],
[
"${feature['building']} === 'school' || ${feature['amenity']} === 'university' || ${feature['building']} === 'kindergarten'",
"color('#ef7f77', 1)"
],
[
"${feature['building']} === 'parking' || ${feature['amenity']} === 'parking' || ${feature['building']} === 'garages' || ${feature['building']} === 'garage'",
"color('#af8b74', 1)"
],
[
"${feature['building']} === 'farm_auxiliary' || ${feature['building']} === 'detached'",
"color('#a69774', 1)"
],
[
true,
"color('#ef7f77', 1)"
]
]
},
{
// "url": 123456,
"maximumScreenSpaceError": 0.1
},
{
"url": "/tileset.json",
"maximumScreenSpaceError": 2
}
],
"gltf": [
{
"url": ".gltf",
"lat": 18.13764,
"lng": 59.16456,
"height": 100,
// This overrides height if not set to NONE, se options @ https://cesium.com/learn/cesiumjs/ref-doc/global.html?classFilter=Height#HeightReference
"heightReference": "CLAMP_TO_TERRAIN",
"animation": false
}
],
"cesiumTerrainProvider": "",
"cesiumIonassetIdTerrain": 1
});
viewer.addComponent(globe);
});
</script>
</body>
</html>