封装百度的js
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;
}
Object.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);
};
开发初始化项目中使用
Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyZmM3OTY4YS1lMzgyLTQ1NTktOTUxNi1hYTAwZTgxYzRmMDYiLCJpZCI6NTE1MjIsImlhdCI6MTYxODE5NTEyOH0.6ZTCtmnrtslvMlO2VLNOh8GEPv63LFrgQyW3GnSNuxE";
Window.viewer = new Cesium.Viewer("container", {
infoBox: false,
selectionIndicator: false,
navigation: false,
animation: false,
timeline: false,
baseLayerPicker: false,
geocoder: false,
homeButton: false,
sceneModePicker: false,
navigationHelpButton: false,
shouldAnimate: true,
fullscreenButton: false,
contextOptions: {
webgl: {
alpha: true,
depth: false,
stencil: true,
antialias: true,
premultipliedAlpha: true,
preserveDrawingBuffer: true,
failIfMajorPerformanceCaveat: true,
},
allowTextureFilterAnisotropic: true,
},
requestRenderMode: true, //降低应用中Cesium的CPU使用率。
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",
}),
});
// 分辨率调整函数
let adjustmentPixel = function () {
// 判断是否支持图像渲染像素化处理
var supportsImageRenderingPixelated =
Window.viewer.cesiumWidget._supportsImageRenderingPixelated;
if (supportsImageRenderingPixelated) {
// 直接拿到设备的像素比例因子 - 如我设置的1.25
var vtxf_dpr = window.devicePixelRatio;
// 这个while我们在后面会做一个说明,但不是解决问题的说明
while (vtxf_dpr >= 2.0) {
vtxf_dpr /= 2.0;
}
// 设置渲染分辨率的比例因子
Window.viewer.resolutionScale = vtxf_dpr;
}
};
adjustmentPixel();
这个是源码使用百度底图的方法,还有另外一种加载插件可以加载百度底图和其他底图
cesiumMap插件(可加载腾旭、天地图、高德、谷歌地图)
gitee插件地址https://gitee.com/xiaolongshiyl/cesium-map