<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Cesium加载高德地图</title>
<link rel="stylesheet" href="../Cesium/Widgets/widgets.css" />
<style>
html,
body {
margin: 0;
width: 100%;
height: 100%;
}
#cesiumContainer {
width: 100%;
height: 100%;
background-color: #f2f2f2;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script src="../Cesium/Cesium.js"></script>
<script>
var viewer = new Cesium.Viewer("cesiumContainer", {
imageryProvider: new Cesium.SingleTileImageryProvider({
url: "data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQImWNgYGBgAAAABQABh6FO1AAAAABJRU5ErkJggg==",
}),
baseLayerPicker: false,
animation: false,
fullscreenButton: false,
vrButton: false,
geocoder: false,
homeButton: false,
infoBox: false,
sceneModePicker: false,
selectionIndicator: false,
timeline: false,
navigationHelpButton: false,
navigationInstructionsInitiallyVisible: false,
scene3DOnly: true,
shouldAnimate: false,
skyBox: false,
});
// 隐藏版权信息
viewer.cesiumWidget.creditContainer.style.display = "none";
// style 6-影像 7-矢量 8-标注
var aMapProvider = new Cesium.UrlTemplateImageryProvider({
url: 'https://webst0{s}.is.autonavi.com/appmaptile?style=7&x={x}&y={y}&z={z}&lang=zh_cn&size=1',
subdomains: ['1', '2', '3', '4'], // 如果有多个子域名用于负载均衡,可以在这里指定
tilingScheme: new Cesium.WebMercatorTilingScheme(),
maximumLevel: 18, // 根据高德地图的实际最大层级设置
});
viewer.imageryLayers.addImageryProvider(aMapProvider);
</script>
</body>
</html>
网友评论