为什么啥也没有
来源：4-4 地图搜索与poi结合（1）
慕雪9296518
2020-06-06 14:27:05
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=43f8ecb2e320ff1df9a97c1087da25c8"></script>
<style type ="text/css">
*{margin: 0;padding: 0;}
#mzac{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
#setCenterNode{position: absolute;z-index: 2;background-color: white;text-align: center;
width: 400px;height: auto;box-shadow: 0 0 15px black;min-height: 400px;}
.currentposit{position: absolute;right: 0;bottom: 0;}
#setCenterNode div{margin: 10px auto;}
span{height: 20px;width:60px;background-color: blue;font-weight: bold;
color: white;display: inline-block;margin-left: 10px;}
.btn3{background-color: gray;color: white;height: 20px;width:120px;}
.currentposit span{background-color: white;color: black;}
.setcenter{width: 100%;height: auto;}
</style>
</head>
<body>
<div id="mzac">
<div id="setCenterNode">
<div>工具栏</div>
<div>搜索城市:<input type="text" name="" id="citynode"><span class="btn1">确定</span></div>
<div>设置显示级别:<input type="text" name="" id="zoomnode"><span class="btn2">确定</span></div>
<div class="btn3">解除范围限制</div>
<div class="currentposit">当前所在省/直辖市:<span class="city">北京市</span></div>
<div class="setcenter"></div>
</div>
</div>
<script text="text/javascript">
var citynode = document.getElementById("citynode");
var zoomnode = document.getElementById("zoomnode");
var btn1 = document.querySelector(".btn1");
var btn2 = document.querySelector(".btn2");
var btn3 = document.querySelector(".btn3");
var city = document.querySelector(".city");
var map = new AMap.Map("mzac",{
zoom:9,
center:[120,30]
});
var mybounds = new AMap.Bounds([116.567542,39.997639],[116.22422,39.813285]);
map.setBounds(mybounds);
btn1.onclick = function(){
map.setCity(citynode.value);
city.innerHTML = citynode.value;
}
btn2.onclick = function(){
map.setZoom(zoomnode.value);
}
btn3.onclick = function(){
var bounce = map.getBounds();
if(btn3.innerHTML == "解除范围限制"){
map.clearLimitBounds(bounce);
btn3.innerHTML = "锁定范围限制";
}else{
map.setLimitBounds(bounce);
btn3.innerHTML = "解除范围限制";
}
}
map.on("click",function(e){
map.setCenter([e.lnglat.lng,e.lnglat.lat])
})
map.on("moveend",function(){
map.getCity(function(info){
city.innerHTML = info.province;
console.log(info.province);
})
})
AMap.service(["AMap.PlaceSearch"],function(){
new AMap.PlaceSearch({
city:'010',
map:map,
panel:'setcenter'
}).search("电影院");
});
</script>
</body>
</html>
老师好，不知道为啥我的啥也没有
1回答
-
好帮手慕言
2020-06-06
同学你好，使用同学的代码在谷歌浏览器测试，是可以显示出来内容的，如下：
同学可以使用谷歌浏览器再测试下。祝学习愉快~
0
相似问题