使用ol-铯,并要启用地图的3D视图。 2D地图范围效果很好,但在3D中效果不佳。 在生成olcs映射对象时看不到任何扩展区参数。任何人都可以帮助到程度?
这是jsfiddle示例: https://jsfiddle.net/j7rptwao/2/
<!DOCTYPE html>
<html>
<head>
<title>Ol-Cesium base example</title>
<link rel="stylesheet" href="http://www.3daysofprogramming.com/playground/pg.css" type="text/css">
<!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL,Map,Set,Promise"></script>
<link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.2.0/css/ol.css">
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.2.0/build/ol.js"></script>
<script src="https://openlayers.org/ol-cesium/node_modules/@camptocamp/cesium/Build/Cesium/Cesium.js"></script>
<script src="https://openlayers.org/ol-cesium/olcesium.js"></script>
<style>
/**
* Create a position for the map
* on the page */
#map {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="container" class="main">
<div id="map"></div>
</div>
<button id="toggle">Toggle Cesium</button>
<script>
var raster = new ol.layer.Tile({
source: new ol.source.OSM()
});
var map = new ol.Map({
layers: [raster],
target: 'map',
view: new ol.View({
center: [-11000000, 4600000],
extent: [-572513.341856, 5211017.966314, 916327.095083, 6636950.728974],
zoom: 8
}),
});
var ol3d = new olcs.OLCesium({map: map, }); // map is the ol.Map instance
var show = true;
ol3d.setEnabled(show);
var btn = document.querySelector('#toggle');
btn.addEventListener('click', function () {
show = !show;
ol3d.setEnabled(show);
});
</script>
</body>
</html>