微信小程序:分享一个百度地图微信小程序api


分享一个百度地图微信小程序api

http://lbsyun.baidu.com/index.php?title=wxjsapi
使用也比较简单,天气就是以前车辆网的api。
支持https,免费。
支持POI查询,默认返回生活服务、美食、酒店三种类型的数据。
支持POI模糊查询,支持输入自动完成。
地址转换服务,支持经纬度转地址。
支持实时天气查询。

---------------------------------------------------------------------

百度地图常用操作

https://www.oschina.net/code/snippet_819257_23342

     
<script type="text/javascript"> 
 
function G(id) {
    return document.getElementById(id);
}
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,16);
  
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
    if(this.getStatus() == BMAP_STATUS_SUCCESS){
        var mk = new BMap.Marker(r.point);
        map.addOverlay(mk);
        map.panTo(r.point); 
        var marker = new BMap.Marker(point);  // 创建标注 
        map.addOverlay(marker); 
        marker.enableDragging();    //可拖拽
        map.addControl(new BMap.NavigationControl());  //添加默认缩放平移控件
//         map.addControl(new BMap.OverviewMapControl());              //添加默认缩略地图控件
//         map.addControl(new BMap.OverviewMapControl({isOpen:true, anchor: BMAP_ANCHOR_TOP_RIGHT}));   //右上角,打开
        map.addControl(new BMap.ScaleControl());                    // 添加默认比例尺控件
        map.addControl(new BMap.MapTypeControl({mapTypes: [BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]}));     //2D图,卫星图
 
        map.addControl(new BMap.MapTypeControl({anchor: BMAP_ANCHOR_TOP_LEFT}));    //左上角,默认地图控件
        map.enableScrollWheelZoom(true);// 允许鼠标滑轮放大缩小
 
        map.disableDragging();   //禁止拖拽 
        setTimeout(function(){
           map.enableDragging();   //三秒后开启拖拽
           map.enableInertialDragging();   //三秒后开启惯性拖拽
        }, 2000); 
      
        var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
            {"input" : "suggestId"
            ,"location" : map
        });
 
        ac.addEventListener("onhighlight", function(e) {  //鼠标放在下拉列表上的事件
        var str = "";
            var _value = e.fromitem.value;
            var value = "";
            if (e.fromitem.index > -1) {
                value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
            }    
            str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
             
            value = "";
            if (e.toitem.index > -1) {
                _value = e.toitem.value;
                value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
            }    
            str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
            G("searchResultPanel").innerHTML = str;
        });
 
        var myValue;
        ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件
        var _value = e.item.value;
            myValue = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
            G("searchResultPanel").innerHTML ="onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
             
            setPlace();
        });
 
        function setPlace(){
            map.clearOverlays();    //清除地图上所有覆盖物
            function myFun(){
                var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
                map.centerAndZoom(pp, 18);
                map.addOverlay(new BMap.Marker(pp));    //添加标注
            }
            var local = new BMap.LocalSearch(map, { //智能搜索
              onSearchComplete: myFun
            });
            local.search(myValue);
        } 
         
         
 //         alert('您的位置:'+r.point.lng+','+r.point.lat);
    }
    else {
//         alert('failed'+this.getStatus());
    }        
},{enableHighAccuracy: true})
//关于状态码
//BMAP_STATUS_SUCCESS   检索成功。对应数值“0”。
//BMAP_STATUS_CITY_LIST 城市列表。对应数值“1”。
//BMAP_STATUS_UNKNOWN_LOCATION  位置结果未知。对应数值“2”。
//BMAP_STATUS_UNKNOWN_ROUTE 导航结果未知。对应数值“3”。
//BMAP_STATUS_INVALID_KEY   非法密钥。对应数值“4”。
//BMAP_STATUS_INVALID_REQUEST   非法请求。对应数值“5”。
//BMAP_STATUS_PERMISSION_DENIED 没有权限。对应数值“6”。(自 1.1 新增)
//BMAP_STATUS_SERVICE_UNAVAILABLE   服务不可用。对应数值“7”。(自 1.1 新增)
//BMAP_STATUS_TIMEOUT   超时。对应数值“8”。(自 1.1 新增)
</script>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=82d7136146878d664def8c56de8255f5"></script>
 
 
 
<dd>  
                <span class="title">输入地址:</span> 
                 <span class="itleLL">    
                      <span class="input-prepend"> 
                  <input type="text" id="suggestId" class="abbre reg_input" placeholder="请输入门店附近名称..." value="无锡" style="width:150px;" autocomplete="off"> 
                   <div id="searchResultPanel" style="border:0px solid #C0C0C0;width:150px;height:0px; display: none; "></div> 
                     </span> 
                  </span>   
                </dd>  
                 <dd>  
                 <div class="row"> 
                        <span class="title">地图位置:</span> 
                 <div class="controls maps"  style="margin-left:130px;border:#ccc solid 1px;">  
                <div id="allmap" ></div>
                    </div> 
                    </div> 
                </dd>



  • 5
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值