百度地图根据关键字搜索并返回信息列表并根据选择位置信息得到经纬度

最新推荐文章于 2021-07-14 16:17:56 发布

张codeMonkey

最新推荐文章于 2021-07-14 16:17:56 发布

阅读量1.9k

点赞数

分类专栏：地图接入

本文链接：https://blog.csdn.net/qq_16989087/article/details/71740094

版权

地图接入专栏收录该内容

0 篇文章 0 订阅

订阅专栏

<body>
<div class="map-box">  
    <div class="pangda-map-sreachbox">
    	<div class="pangda-map-wrapper">
    		<img src="./images/pangda-wechat/timg.png" class="timg">
            <input id="searchplace" class="pangda-map-input" placeholder="输入地址关键字" />
            <a id="s_p_search_btn" href="#" class="sreach-btn-icon">搜索</a>
        </div>
     </div>
	<div id="l-map"></div>
	<div id="result"></div>
</div>
</body>
</html>
<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("l-map");        
	map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);

	var options = {
		renderOptions: {map: map},
		onSearchComplete: function(results){console.log(1122)
			// 判断状态是否正确
			if (local.getStatus() == BMAP_STATUS_SUCCESS){
				var s = [];
				for (var i = 0; i < results.getCurrentNumPois(); i ++){
					s.push(results.getPoi(i).title + ", " + results.getPoi(i).address);
				}
				document.getElementById("result").innerHTML = s.join("<br/>");

                                $('.item').click(function(){
					var keyword = $(this).find('.item-p').text();console.log(keyword)
				    localSearch.setSearchCompleteCallback(function (searchResult) {
				        var poi = searchResult.getPoi(0);
				        console.log(poi.point.lng,poi.point.lat)
				    });
				    localSearch.search(keyword);
				});

			}
		}
	};
	
	var local = new BMap.LocalSearch(map, options);
	$('.sreach-btn-icon').click(function(){  
		local.search($("#searchplace").val());
	});
</script>