• 百度地图poi搜索框


    1:初始化地图

    var map = new BMap.Map("container");//初始化地图
    point = new BMap.Point(126.65771686, 45.77322463);
    ////初始化地图中心点
    map.centerAndZoom(point, 10);
    //启用滚轮放大缩小   默认禁用
    map.enableScrollWheelZoom();   
    //启用地图惯性拖拽   默认禁用
    map.enableContinuousZoom(); 
    
    //添加搜索框 步骤2

    2:添加搜索框

     // 创建控件
        var myZoomCtrl = new ZoomControl();
        // 添加到地图当中
        map.addControl(myZoomCtrl);
    
    
        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;
            $("#searchResultPanel").innerHTML = str;
        });
    
        var myValue;
        ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件
            debugger;    
        var _value = e.item.value;
            myValue = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
            $("#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, 14);
                marker=new BMap.Marker(pp)
                map.addOverlay(marker);    //添加标注
            }
            var local = new BMap.LocalSearch(map, { //智能搜索
              onSearchComplete: myFun
            });
            local.search(myValue);
        }
  • 相关阅读:
    Kappa Architecture: A Different Way to Process Data
    Lambda architecture and Kappa architecture
    Questioning the lambda architecure
    Lambda Architecture: Achieving Velocity and Volume with Big Data
    beego 参数配置
    hadoop 3.1.1 安装
    Idea 切换git账号
    IntelliJ IDEA 开发git多模块项目
    打印1到1亿的平方
    IDEA 逆向工程
  • 原文地址:https://www.cnblogs.com/hejunnuo/p/12766474.html
Copyright © 2020-2023  润新知