百度地图开发,如果拖动这个红色图标,底下箭头的周边检索如何根据拖动动态展示呢?

2017-08-04 12:14:27 +08:00
 xiaxueme

百度地图开发,如果拖动这个红色图标,底下箭头的周边检索如何根据拖动动态展示呢?

2217 次点击
所在节点    问与答
12 条回复
yao978318542
2017-08-04 14:04:00 +08:00
这也太简单了吧!你是做的 APP 还是 web
xiaxueme
2017-08-04 14:15:27 +08:00
@yao978318542 做 web 的,可不可以指点一下怎么做呢?
yao978318542
2017-08-04 14:43:08 +08:00
@xiaxueme #2
为标注点绑定拖拽事件 可得到标注点的经纬度 然后逆推便可检索
```javascript
marker.addEventListener("dragend", function(e){
console.log(e.point);

});
```
yao978318542
2017-08-04 14:43:52 +08:00
@yao978318542 #3 markdown 编辑器还真是琢磨不透呢?哎!你有神马好用的转换工具吗?
xiaxueme
2017-08-04 15:02:23 +08:00
@yao978318542 除了 markdown 其他的真心不知道啥了,谢谢,我试试,
xiaxueme
2017-08-04 17:13:52 +08:00
@yao978318542 这是我的代码,我写进去搜索的代码了,为何我的页面不动态显示呢?
```javascript
map.addEventListener("dragend", function(e){
var options = {
onSearchComplete: function(results){
if (local.getStatus() == BMAP_STATUS_SUCCESS){
var s = [],html='';
for (var i = 0; i < results.getCurrentNumPois(); i ++){
s.push(results.getPoi(i).title + ", " + results.getPoi(i).address);
}
for(var i=0;i<s.length;i++){
html+='<div class="r-result-box">'+'<h4>'+s[i].split(',')[0]+'</h4>'+'<p>'+s[i].split(',')[1]+'</p>'+'</div>';
}
console.log(html);
$('#r-result').html(html);
html='';
}
}
};
var local = new BMap.LocalSearch(map, options);
local.search("小区","大厦","学校");
});
```
yao978318542
2017-08-04 17:18:59 +08:00
@xiaxueme #6 map ?不是地图吗?你绑定他干啥 绑定你那个标注点啊
xiaxueme
2017-08-04 17:23:51 +08:00
@yao978318542 不太清楚你说什么,好人帮到底,能加下 qq 么,看下代码可以嘛,我的是 1114929281,
xiaxueme
2017-08-04 17:27:05 +08:00
@yao978318542 而且我绑定到点上了,数据还是第一次定位的,移动点不是动态显示的,请教一下。
yao978318542
2017-08-04 17:28:21 +08:00
现在上班不太方便啊 下班回去你看可以不
xiaxueme
2017-08-04 17:31:50 +08:00
@yao978318542 可以啊,晚上等你,
yao978318542
2017-08-04 18:12:31 +08:00
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
#l-map{height:500px;width:100%;}
#r-result{width:100%;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
<title>设置点是否可拖拽</title>
</head>
<body>
<div id="l-map"></div>
<div id="r-result">
</div>
</body>
</html>
<script type="text/javascript">
// 百度地图 API 功能
var map = new BMap.Map("l-map");
var point = new BMap.Point(116.400244,39.92556);
map.centerAndZoom(point, 15);
var marker = new BMap.Marker(point);// 创建标注
map.addOverlay(marker); // 将标注添加到地图中
marker.enableDragging();
marker.addEventListener("dragend", function(e){
console.log(e.point);
var local = new BMap.LocalSearch(e.point, {
renderOptions: {map: map, panel: "r-result"}
});
local.searchNearby("超市",e.point,1000);

});
</script>
看看是不是你想要的功能

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/380386

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX