浏览器看不到3D效果

来源:7-1 2d-3d转换

TKLook

2021-01-12 10:14:46

问题描述:

Chrome Firefox Opera IE 都试过,看不到3D效果,麻烦帮忙看下是哪里的问题

相关截图:

http://img.mukewang.com/climg/5ffd05800919a34209530600.jpg

相关代码:

<!Doctype html>
<html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>地图类型转换</title>
<script type="text/javascript"
src="https://webapi.amap.com/maps?v=1.4.15&key=aa2dd8517ace29ac1eb05616ce5c9498&plugin=AMap.ControlBar">

</script>
<style>
* {
margin: 0;
padding: 0;
list-style: none;
}

#container {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}

.amap-icon img {
width: 25px;
height: 30px;
}
</style>
</head>

<body>

<div id="container"></div>






<script>
var map = new AMap.Map('container', {
zoom: 17,
pitch: 83,
center: [116.379391, 39.861536],
viewMode: '3D',
buildingAnimation: true
});


map.addControl(new AMap.ControlBar({
showZoomBar: true,
showControlButton: true,
position: {
right: '50px',
top: '30px'
}
}))
</script>
</body>

</html>

尝试过的解决方式:

检查代码

写回答

2回答

好帮手慕夭夭

2021-01-12

同学你好,看截图浏览器是可以的,老师这边又多次测试了一下,代码能实现效果。应该是在浏览器打开页面时,默认是2d效果。建议点击右上角,切换一下3d效果。如下:

http://img.mukewang.com/climg/5ffd383c09f22a7a19200585.jpg

祝学习愉快~


0
hKLook
hp>好的,谢谢老师

h021-01-12
共1条回复

好帮手慕夭夭

2021-01-12

同学你好,老师拿同学的代码测试,可以看到3d效果,如下图所示:

http://img.mukewang.com/climg/5ffd19f0095e6a8418920927.jpg


测试的浏览器为谷歌和火狐,以谷歌为例,使用的是谷歌最新版,如下:

http://img.mukewang.com/climg/5ffd1aa209b2073304520167.jpg


可能是同学浏览器的问题,建议把谷歌浏览器卸载重装一下。祝学习愉快~

0
hKLook
hp>使用的是 win10 系统

h021-01-12
共2条回复

0 学习 · 6815 问题

查看课程