Cesium
HTML
<script src="http://openlayers.org/ol-cesium/olcesium.js"></script>
<script src="http://openlayers.org/ol-cesium/Cesium/Cesium.js"></script>
<link rel="stylesheet" href="http://openlayers.org/ol-cesium/ol.css">
<div id="map" style="width:600px;height:400px;"></div>
JavaScript
const ol2d = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
controls: ol.control.defaults({
attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
collapsible: false
})
}),
target: 'map',
view: new ol.View({
center: ol.proj.transform([-53.23569, -14.23568], 'EPSG:4326', 'EPSG:3857'),
zoom: 4
})
});
const ol3d = new olcs.OLCesium({
map: ol2d
});
const scene = ol3d.getCesiumScene();
const terrainProvider = new Cesium.CesiumTerrainProvider({
url: '//assets.agi.com/stk-terrain/world',
requestVertexNormals: true
});
scene.terrainProvider = terrainProvider;
ol3d.setEnabled(true);