ol-cesium
Version:
OpenLayers Cesium integration library
242 lines • 19.6 kB
HTML
<html class="default no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>"olcs/contrib/Manager" | ol-cesium</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../assets/css/main.css">
</head>
<body>
<header>
<div class="tsd-page-toolbar">
<div class="container">
<div class="table-wrap">
<div class="table-cell" id="tsd-search" data-index="../assets/js/search.js" data-base="..">
<div class="field">
<label for="tsd-search-field" class="tsd-widget search no-caption">Search</label>
<input id="tsd-search-field" type="text" />
</div>
<ul class="results">
<li class="state loading">Preparing search index...</li>
<li class="state failure">The search index is not available</li>
</ul>
<a href="../index.html" class="title">ol-cesium</a>
</div>
<div class="table-cell" id="tsd-widgets">
<div id="tsd-filter">
<a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a>
<div class="tsd-filter-group">
<div class="tsd-select" id="tsd-filter-visibility">
<span class="tsd-select-label">All</span>
<ul class="tsd-select-list">
<li data-value="public">Public</li>
<li data-value="protected">Public/Protected</li>
<li data-value="private" class="selected">All</li>
</ul>
</div>
<input type="checkbox" id="tsd-filter-inherited" checked />
<label class="tsd-widget" for="tsd-filter-inherited">Inherited</label>
<input type="checkbox" id="tsd-filter-only-exported" />
<label class="tsd-widget" for="tsd-filter-only-exported">Only exported</label>
</div>
</div>
<a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a>
</div>
</div>
</div>
</div>
<div class="tsd-page-title">
<div class="container">
<ul class="tsd-breadcrumb">
<li>
<a href="../globals.html">Globals</a>
</li>
<li>
<a href="_olcs_contrib_manager_.html">"olcs/contrib/Manager"</a>
</li>
</ul>
<h1>External module "olcs/contrib/Manager"</h1>
</div>
</div>
</header>
<div class="container container-main">
<div class="row">
<div class="col-8 col-content">
<section class="tsd-panel-group tsd-index-group">
<h2>Index</h2>
<section class="tsd-panel tsd-index-panel">
<div class="tsd-index-content">
<section class="tsd-index-section ">
<h3>Variables</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-variable tsd-parent-kind-external-module"><a href="_olcs_contrib_manager_.html#manager" class="tsd-kind-icon">Manager</a></li>
</ul>
</section>
</div>
</section>
</section>
<section class="tsd-panel-group tsd-member-group ">
<h2>Variables</h2>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-external-module">
<a name="manager" class="tsd-anchor"></a>
<h3><span class="tsd-flag ts-flagConst">Const</span> Manager</h3>
<div class="tsd-signature tsd-kind-icon">Manager<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">Manager</span><span class="tsd-signature-symbol"> = class extends olObservable {/*** @param {string} cesiumUrl* @param {olcsx.contrib.ManagerOptions} options* @api*/constructor(cesiumUrl, {map, cameraExtentInRadians} = {}) {super();/*** @type {string}* @private*/this.cesiumUrl_ = cesiumUrl;/*** @type {ol.Map}* @protected*/this.map = map;/*** @type {ol.Extent}* @protected*/this.cameraExtentInRadians = cameraExtentInRadians || null;/*** @private* @type {Cesium.BoundingSphere}*/this.boundingSphere_;/*** @type {boolean}* @private*/this.blockLimiter_ = false;/*** @type {Promise.<olcs.OLCesium>}* @private*/this.promise_;/*** @type {olcs.OLCesium}* @protected*/this.ol3d;/*** @const {number} Tilt angle in radians* @private*/this.cesiumInitialTilt_ = toRadians(50);/*** @protected* @type {number}*/this.fogDensity = 0.0001;/*** @protected* @type {number}*/this.fogSSEFactor = 25;/*** Limit the minimum distance to the terrain to 2m.* @protected* @type {number}*/this.minimumZoomDistance = 2;/*** Limit the maximum distance to the earth to 10'000km.* @protected* @type {number}*/this.maximumZoomDistance = 10000000;// when closer to 3000m, restrict the available positions harder/*** @protected* @param {number} height*/this.limitCameraToBoundingSphereRatio = height => (height > 3000 ? 9 : 3);}/*** @return {Promise.<olcs.OLCesium>}*/load() {if (!this.promise_) {const cesiumLazyLoader = new olcsContribLazyLoader(this.cesiumUrl_);this.promise_ = cesiumLazyLoader.load().then(() => this.onCesiumLoaded());}return this.promise_;}/*** @protected* @return {olcs.OLCesium}*/onCesiumLoaded() {if (this.cameraExtentInRadians) {const rect = new Cesium.Rectangle(...this.cameraExtentInRadians);// Set the fly home rectangleCesium.Camera.DEFAULT_VIEW_RECTANGLE = rect;this.boundingSphere_ = Cesium.BoundingSphere.fromRectangle3D(rect, Cesium.Ellipsoid.WGS84, 300); // lux mean height is 300m}this.ol3d = this.instantiateOLCesium();const scene = this.ol3d.getCesiumScene();this.configureForUsability(scene);this.configureForPerformance(scene);this.dispatchEvent('load');return this.ol3d;}/*** Application code should override this method.* @return {olcs.OLCesium}*/instantiateOLCesium() {console.assert(this.map);const ol3d = new OLCesium({map: this.map});const scene = ol3d.getCesiumScene();const terrainProvider = Cesium.createWorldTerrain();scene.terrainProvider = terrainProvider;return ol3d;}/*** @param {!Cesium.Scene} scene The scene, passed as parameter for convenience.* @protected*/configureForPerformance(scene) {const fog = scene.fog;fog.enabled = true;fog.density = this.fogDensity;fog.screenSpaceErrorFactor = this.fogSSEFactor;}/*** @param {!Cesium.Scene} scene The scene, passed as parameter for convenience.* @protected*/configureForUsability(scene) {const sscController = scene.screenSpaceCameraController;sscController.minimumZoomDistance = this.minimumZoomDistance;sscController.maximumZoomDistance = this.maximumZoomDistance;// Do not see through the terrain. Seeing through the terrain does not make// sense anyway, except for debuggingscene.globe.depthTestAgainstTerrain = true;// Use white instead of the black default colour for the globe when tiles are missingscene.globe.baseColor = Cesium.Color.WHITE;scene.backgroundColor = Cesium.Color.WHITE;if (this.boundingSphere_) {scene.postRender.addEventListener(this.limitCameraToBoundingSphere.bind(this), scene);}// Stop rendering Cesium when there is nothing to do. This drastically reduces CPU/GPU consumption.this.ol3d.enableAutoRenderLoop();}/*** Constrain the camera so that it stays close to the bounding sphere of the map extent.* Near the ground the allowed distance is shorter.* @protected*/limitCameraToBoundingSphere() {if (this.boundingSphere_ && !this.blockLimiter_) {const scene = this.ol3d.getCesiumScene();const camera = scene.camera;const position = camera.position;const carto = Cesium.Cartographic.fromCartesian(position);const ratio = this.limitCameraToBoundingSphereRatio(carto.height);if (Cesium.Cartesian3.distance(this.boundingSphere_.center, position) > this.boundingSphere_.radius * ratio) {const currentlyFlying = camera.flying;if (currentlyFlying === true) {// There is a flying property and its value is truereturn;} else {this.blockLimiter_ = true;const unblockLimiter = () => this.blockLimiter_ = false;camera.flyToBoundingSphere(this.boundingSphere_, {complete: unblockLimiter,cancel: unblockLimiter});}}}}/*** Enable or disable ol3d with a default animation.* @export* @return {Promise<undefined>}*/toggle3d() {return this.load().then((/** @const {!olcs.OLCesium} */ ol3d) => {const is3DCurrentlyEnabled = ol3d.getEnabled();const scene = ol3d.getCesiumScene();if (is3DCurrentlyEnabled) {// Disable 3Dconsole.assert(this.map);return olcsCore.resetToNorthZenith(this.map, scene).then(() => {ol3d.setEnabled(false);this.dispatchEvent('toggle');});} else {// Enable 3Dol3d.setEnabled(true);this.dispatchEvent('toggle');return olcsCore.rotateAroundBottomCenter(scene, this.cesiumInitialTilt_);}});}/*** Enable ol3d with a view built from parameters.** @export* @param {number} lon* @param {number} lat* @param {number} elevation* @param {number} headingDeg Heading value in degrees.* @param {number} pitchDeg Pitch value in degrees.* @returns {Promise<undefined>}*/set3dWithView(lon, lat, elevation, headingDeg, pitchDeg) {return this.load().then((/** @const {!olcs.OLCesium} */ ol3d) => {const is3DCurrentlyEnabled = ol3d.getEnabled();const scene = ol3d.getCesiumScene();const camera = scene.camera;const destination = Cesium.Cartesian3.fromDegrees(lon, lat, elevation);const heading = Cesium.Math.toRadians(headingDeg);const pitch = Cesium.Math.toRadians(pitchDeg);const roll = 0;const orientation = {heading, pitch, roll};if (!is3DCurrentlyEnabled) {ol3d.setEnabled(true);this.dispatchEvent('toggle');}camera.setView({destination,orientation});});}/*** @export* @return {boolean}*/is3dEnabled() {return !!this.ol3d && this.ol3d.getEnabled();}/*** @return {number}*/getHeading() {return this.map ? this.map.getView().getRotation() || 0 : 0;}/*** @return {number|undefined}*/getTiltOnGlobe() {const scene = this.ol3d.getCesiumScene();const tiltOnGlobe = olcsCore.computeSignedTiltAngleOnGlobe(scene);return -tiltOnGlobe;}/*** @param {number} angle*/setHeading(angle) {const scene = this.ol3d.getCesiumScene();const bottom = olcsCore.pickBottomPoint(scene);if (bottom) {olcsCore.setHeadingUsingBottomCenter(scene, angle, bottom);}}/*** @export* @return {olcs.OLCesium}*/getOl3d() {return this.ol3d;}/*** @export* @return {!ol.View}*/getOlView() {const view = this.map.getView();console.assert(view);return view;}/*** @export* @return {Cesium.Matrix4}*/getCesiumViewMatrix() {return this.ol3d.getCesiumScene().camera.viewMatrix;}/*** @export* @return {!Cesium.Scene}*/getCesiumScene() {return this.ol3d.getCesiumScene();}/*** @export* @param {!Cesium.Rectangle} rectangle* @param {number=} offset in meters* @return {Promise<undefined>}*/flyToRectangle(rectangle, offset = 0) {const camera = this.getCesiumScene().camera;const destination = camera.getRectangleCameraCoordinates(rectangle);const mag = Cesium.Cartesian3.magnitude(destination) + offset;Cesium.Cartesian3.normalize(destination, destination);Cesium.Cartesian3.multiplyByScalar(destination, mag, destination);return new Promise((resolve, reject) => {if (!this.cameraExtentInRadians) {reject();return;}camera.flyTo({destination,complete: () => resolve(),cancel: () => reject(),endTransform: Cesium.Matrix4.IDENTITY});});}/*** @protected* @return {Cesium.Rectangle|undefined}*/getCameraExtentRectangle() {if (this.cameraExtentInRadians) {return new Cesium.Rectangle(...this.cameraExtentInRadians);}}}</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in <a href="https://github.com/openlayers/ol-cesium/blob/642e1e2/src/olcs/contrib/Manager.js#L18">olcs/contrib/Manager.js:18</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-comment-tags">
<dt>typedef</dt>
<dd><p>{Object} ManagerOptions</p>
</dd>
<dt>property</dt>
<dd><p>{import('ol/Map.js').default} map</p>
</dd>
<dt>property</dt>
<dd><p>{import('ol/extent.js').Extent} [cameraExtentInRadians]</p>
</dd>
</dl>
</div>
</section>
</section>
</div>
<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
<nav class="tsd-navigation primary">
<ul>
<li class="globals ">
<a href="../globals.html"><em>Globals</em></a>
</li>
<li class=" tsd-kind-external-module">
<a href="_index_library_.html">"index.library"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_abstractsynchronizer_.html">"olcs/<wbr>Abstract<wbr>Synchronizer"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_autorenderloop_.html">"olcs/<wbr>Auto<wbr>Render<wbr>Loop"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_camera_.html">"olcs/<wbr>Camera"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_featureconverter_.html">"olcs/<wbr>Feature<wbr>Converter"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_olcesium_.html">"olcs/OLCesium"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_overlaysynchronizer_.html">"olcs/<wbr>Overlay<wbr>Synchronizer"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_rastersynchronizer_.html">"olcs/<wbr>Raster<wbr>Synchronizer"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_synchronizedoverlay_.html">"olcs/<wbr>Synchronized<wbr>Overlay"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_vectorsynchronizer_.html">"olcs/<wbr>Vector<wbr>Synchronizer"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_contrib_lazyloader_.html">"olcs/contrib/<wbr>Lazy<wbr>Loader"</a>
</li>
<li class="current tsd-kind-external-module">
<a href="_olcs_contrib_manager_.html">"olcs/contrib/<wbr>Manager"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_core_.html">"olcs/core"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_core_olimageryprovider_.html">"olcs/core/OLImagery<wbr>Provider"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_core_vectorlayercounterpart_.html">"olcs/core/<wbr>Vector<wbr>Layer<wbr>Counterpart"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_math_.html">"olcs/math"</a>
</li>
<li class=" tsd-kind-external-module">
<a href="_olcs_util_.html">"olcs/util"</a>
</li>
</ul>
</nav>
<nav class="tsd-navigation secondary menu-sticky">
<ul class="before-current">
<li class=" tsd-kind-variable tsd-parent-kind-external-module">
<a href="_olcs_contrib_manager_.html#manager" class="tsd-kind-icon">Manager</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<footer class="with-border-bottom">
<div class="container">
<h2>Legend</h2>
<div class="tsd-legend-group">
<ul class="tsd-legend">
<li class="tsd-kind-module"><span class="tsd-kind-icon">Module</span></li>
<li class="tsd-kind-object-literal"><span class="tsd-kind-icon">Object literal</span></li>
<li class="tsd-kind-variable"><span class="tsd-kind-icon">Variable</span></li>
<li class="tsd-kind-function"><span class="tsd-kind-icon">Function</span></li>
<li class="tsd-kind-function tsd-has-type-parameter"><span class="tsd-kind-icon">Function with type parameter</span></li>
<li class="tsd-kind-index-signature"><span class="tsd-kind-icon">Index signature</span></li>
<li class="tsd-kind-type-alias"><span class="tsd-kind-icon">Type alias</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-enum"><span class="tsd-kind-icon">Enumeration</span></li>
<li class="tsd-kind-enum-member"><span class="tsd-kind-icon">Enumeration member</span></li>
<li class="tsd-kind-property tsd-parent-kind-enum"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-enum"><span class="tsd-kind-icon">Method</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-interface"><span class="tsd-kind-icon">Interface</span></li>
<li class="tsd-kind-interface tsd-has-type-parameter"><span class="tsd-kind-icon">Interface with type parameter</span></li>
<li class="tsd-kind-constructor tsd-parent-kind-interface"><span class="tsd-kind-icon">Constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-interface"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-interface"><span class="tsd-kind-icon">Method</span></li>
<li class="tsd-kind-index-signature tsd-parent-kind-interface"><span class="tsd-kind-icon">Index signature</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-class"><span class="tsd-kind-icon">Class</span></li>
<li class="tsd-kind-class tsd-has-type-parameter"><span class="tsd-kind-icon">Class with type parameter</span></li>
<li class="tsd-kind-constructor tsd-parent-kind-class"><span class="tsd-kind-icon">Constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-class"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class"><span class="tsd-kind-icon">Method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class"><span class="tsd-kind-icon">Accessor</span></li>
<li class="tsd-kind-index-signature tsd-parent-kind-class"><span class="tsd-kind-icon">Index signature</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-constructor tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited accessor</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected accessor</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private accessor</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-static"><span class="tsd-kind-icon">Static property</span></li>
<li class="tsd-kind-call-signature tsd-parent-kind-class tsd-is-static"><span class="tsd-kind-icon">Static method</span></li>
</ul>
</div>
</div>
</footer>
<div class="container tsd-generator">
<p>Generated using <a href="http://typedoc.org/" target="_blank">TypeDoc</a></p>
</div>
<div class="overlay"></div>
<script src="../assets/js/main.js"></script>
<script>if (location.protocol == 'file:') document.write('<script src="../assets/js/search.js"><' + '/script>');</script>
</body>
</html>