Cesium图层加载及影像服务添加

默认图层删除 viewer.imageryLayers.remove(viewer.imageryLayers.get(0))

1、加载单张图片

javascript 复制代码

const imagelayer = await Cesium.SingleTileImageryProvider.fromUrl('/imgs/earth01.jpg');
let options = {
	alpha: 1,
};
let imageryLayer = new Cesium.ImageryLayer(imagelayer, options);
viewer.imageryLayers.add(imageryLayer);

2、加载xyz服务

javascript 复制代码

const xyz = new Cesium.UrlTemplateImageryProvider({
		url: '///data.mars3d.cn/tile/img/{z}/{x}/{y}.jpg',
});
let xyzLayer = new Cesium.ImageryLayer(xyz);
viewer.imageryLayers.add(xyzLayer);

3、加载wms服务

javascript 复制代码

	const wms = new Cesium.WebMapServiceImageryProvider({
		url: 'https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi?',
		layers: 'nexrad-n0r', //要包括的图层，以逗号分隔。
		parameters: {
			// 在GetMap URL中传递给WMS服务器的其他参数。
			transparent: 'true',
			format: 'image/png',
		},
	});
	let imageryLayer = new Cesium.ImageryLayer(wms);
	viewer.imageryLayers.add(imageryLayer);

4、加载天地图影像服务

javascript 复制代码

    // 矢量底图
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'https://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=' + tdtKey,
			subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
			maximumLevel: 18,
			minimumLevel: 3,
		})
	);
	//矢量注记
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'https://t{s}.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=' + tdtKey,
			subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
			maximumLevel: 18,
			minimumLevel: 3,
		})
	);
	//影像底图
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'https://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=' + tdtKey,
			subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
			maximumLevel: 18,
			minimumLevel: 3,
		})
	);

	//影像注记
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'https://t{s}.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=' + tdtKey,
			subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
			maximumLevel: 18,
			minimumLevel: 3,
		})
	);

5、加载高德影像服务

javascript 复制代码

	//高德矢量地图
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
			minimumLevel: 3,
			maximumLevel: 18,
		})
	);

	// 加载高德影像
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'https://webst02.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}',
			minimumLevel: 3,
			maximumLevel: 18,
		})
	);

	//加载高德注记
	viewer.imageryLayers.addImageryProvider(
		new Cesium.UrlTemplateImageryProvider({
			url: 'http://webst02.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scale=1&style=8',
			minimumLevel: 3,
			maximumLevel: 18,
		})
	);