1.源代码 :
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>楼块图层</title>
<style>
html,
body,
#container {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="container"></div>
<script src="//webapi.amap.com/maps?v=2.0&key=您申请的key值"></script>
<script>
var map = new AMap.Map('container', {
center: [116.397428, 39.90923],
viewMode: '3D',
pitch: 60,
rotation: -35,
// 隐藏默认楼块
features: ['bg', 'road', 'point'],
mapStyle: 'amap://styles/light',
layers: [
// 高德默认标准图层
new AMap.TileLayer.Satellite(),
// 楼块图层
new AMap.Buildings({
zooms: [16, 18],
zIndex: 10,
heightFactor: 2, //2倍于默认高度,3D下有效
wallColor:'rgba(54,207,201,0.7)',
roofColor: 'rgba(8,151,156,0.5)',
})
],
zoom: 16.8,
});
</script>
</body>
</html>
2.效果图: