|
阅读：1839回复：0
Cesium：加载百度地图
https://blog.csdn.net/KaiSarH/article/details/106242572
效果 代码 <!DOCTYPE html> <html lang="ch"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="Cesium-1.66/Build/Cesium/Widgets/widgets.css"> <style> #map3d { height: 600px; width: 1000px; margin: 0 auto; position: relative; } </style> </head> <body> <div id="map3d"> </div> </body> <script src="Cesium-1.66/Build/Cesium/Cesium.js"></script> <script src="jQuery.js"></script> <script src="baidu.js"></script> <script> viewer = new Cesium.Viewer('map3d', { selectionIndicator: false, animation: false, baseLayerPicker: false, timeline: false, sceneModePicker: true, navigationHelpButton: false, useDefaultRenderLoop: true, showRenderLoopErrors: true, fullscreenButton: false, infoBox: false, imageryProvider: new BaiduImageryProvider({ url: "http://online{s}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl&scaler=1&p=1" }) }); viewer.camera.setView({ destination: Cesium.Cartesian3.fromDegrees(116.46, 39.92, 10000000.0), }); // 设置初始位置 // 分辨率调整函数 let adjustmentPixel = function () { // 判断是否支持图像渲染像素化处理 var supportsImageRenderingPixelated = viewer.cesiumWidget._supportsImageRenderingPixelated; if (supportsImageRenderingPixelated) { // 直接拿到设备的像素比例因子 - 如我设置的1.25 var vtxf_dpr = window.devicePixelRatio; // 这个while我们在后面会做一个说明，但不是解决问题的说明 while (vtxf_dpr >= 2.0) { vtxf_dpr /= 2.0; } // 设置渲染分辨率的比例因子 viewer.resolutionScale = vtxf_dpr; } }; adjustmentPixel(); viewer.scene.postProcessStages.fxaa.enabled = false; //viewer.scene.globe.depthTestAgainstTerrain = true; viewer.scene.fxaa = false; let handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas); handler.setInputAction(function (event) { let earthPosition = viewer.camera.pickEllipsoid(event.position,viewer.scene.globe.ellipsoid); if (Cesium.defined(earthPosition)) { let ellipsoid = viewer.scene.globe.ellipsoid; let cartographic = ellipsoid.cartesianToCartographic(earthPosition); let lat = Cesium.Math.toDegrees(cartographic.latitude); let lon = Cesium.Math.toDegrees(cartographic.longitude); } }, Cesium.ScreenSpaceEventType.LEFT_CLICK); </script> </html> function BaiduImageryProvider(options) { this._errorEvent = new Cesium.Event(); this._tileWidth = 256; this._tileHeight = 256; this._maximumLevel = 18; this._minimumLevel = 1; var southwestInMeters = new Cesium.Cartesian2(-33554054, -33746824); var northeastInMeters = new Cesium.Cartesian2(33554054, 33746824); this._tilingScheme = new Cesium.WebMercatorTilingScheme({ rectangleSouthwestInMeters: southwestInMeters, rectangleNortheastInMeters: northeastInMeters }); this._rectangle = this._tilingScheme.rectangle; var resource = Cesium.Resource.createIfNeeded(options.url); this._resource = resource; this._tileDiscardPolicy = undefined; this._credit = undefined; this._readyPromise = undefined; } Cesium.defineProperties(BaiduImageryProvider.prototype, { url: { get: function () { return this._resource.url; } }, proxy: { get: function () { return this._resource.proxy; } }, tileWidth: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('tileWidth must not be called before the imagery provider is ready.'); } return this._tileWidth; } }, tileHeight: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('tileHeight must not be called before the imagery provider is ready.'); } return this._tileHeight; } }, maximumLevel: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('maximumLevel must not be called before the imagery provider is ready.'); } return this._maximumLevel; } }, minimumLevel: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('minimumLevel must not be called before the imagery provider is ready.'); } return this._minimumLevel; } }, tilingScheme: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('tilingScheme must not be called before the imagery provider is ready.'); } return this._tilingScheme; } }, tileDiscardPolicy: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('tileDiscardPolicy must not be called before the imagery provider is ready.'); } return this._tileDiscardPolicy; } }, rectangle: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('rectangle must not be called before the imagery provider is ready.'); } return this._rectangle; } }, errorEvent: { get: function () { return this._errorEvent; } }, ready: { get: function () { return this._resource; } }, readyPromise: { get: function () { return this._readyPromise; } }, credit: { get: function () { if (!this.ready) { throw new Cesium.DeveloperError('credit must not be called before the imagery provider is ready.'); } return this._credit; } }, }); BaiduImageryProvider.prototype.requestImage = function (x, y, level, request) { var r = this._tilingScheme.getNumberOfXTilesAtLevel(level); var c = this._tilingScheme.getNumberOfYTilesAtLevel(level); var s = this.url.replace("{x}", x - r / 2).replace("{y}", c / 2 - y - 1).replace("{z}", level).replace("{s}", Math.floor(10 * Math.random())); return Cesium.ImageryProvider.loadImage(this, s); }; ———————————————— 版权声明： 原文链接：https://blog.csdn.net/KaiSarH/article/details/106242572 |
|
