线下拼团交流
能否增加地图搜索功能,现在地址输好了没有搜索。百度地图就可以搜索自动定位到当前地址。
  • 阳光李林 消费5554.91元 2019-01-18 10:13 10:13
1235
19

能否增加地图搜索功能,现在地址输好了没有搜索。百度地图就可以搜索自动定位到当前地址。


  • 搜索地址就能自动标注位置,不用手动标注了。如果能实现,希望尽快解决一下,这个很重要,填写地址,点击搜索自动标注,这样体验就比较好。现在是输入进去,地图上有的弹出来的才能点击,没有的都不能搜索电脑板也是一样的,也没有搜索按钮,敲回车也不行。我测试了好多系统都有这个功能,搜索地址,标注。


  • 这是我的其他系统的功能,感觉这个功能很好很方便。

  • 老大,尽快把这个问题给解决了。

9
赏礼
赏钱
收藏
点击回复
      全部留言
  • 19
  • Suifeng 程序开发者 消费:23.24元 2019-01-18 14:39 14:396楼
    <?php
    function_exists('urls') || die('ERR');
    $info[$name] || $info[$name] = '113.268332,23.130274';
    $jscode = '';
    if(fun('field@load_js',$field['type'])){
    	$jscode = <<<EOT
    <style type="text/css">
    .bmap{width:100%;height:350px;border: 1px solid #ccc;}
    .searchResultPanel{border:1px solid #C0C0C0;width:150px;height:auto;display:none;}
    .baaapsou{width: 10%;float: left;cursor:pointer;height: 28px;line-height: 28px;text-align: center;border: 1px solid #C0C0C0;border-radius: 3px;margin-left: 1%;}
    </style>
    <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&;ak=MGdbmO6pP5Eg1hiPhpYB0IVd"></script>
    <script type="text/javascript">
    jQuery(document).ready(function() {
        $('.js-bmap').each(function() {
            var that = $(this);
            var map_canvas = that.find('.bmap').attr('id');
            var address = that.find('.bmap-address');
            var address_id = address.attr('id');
            var map_point = that.find('.bmap-point');
            var search_result = that.find('.searchResultPanel');
            var point_lng = 113.268332;
            var point_lat = 23.130274;
            var map_level = that.data('level');
            // 百度地图API功能
            var map = new BMap.Map(map_canvas);
            //开启鼠标滚轮缩放
            map.enableScrollWheelZoom(true);
            // 左上角,添加比例尺
            var top_left_control = new BMap.ScaleControl({
                anchor: BMAP_ANCHOR_TOP_LEFT
            });
            // 左上角,添加默认缩放平移控件
            var top_left_navigation = new BMap.NavigationControl();
            map.addControl(top_left_control);
            map.addControl(top_left_navigation);
            // 智能搜索
            var local = new BMap.LocalSearch(map, {
                onSearchComplete: function() {
                    var point = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
                    map.centerAndZoom(point, 18);
                    // 创建标注
                    create_mark(point);
                }
            });
            // 发起检索
            $("#baaapsou-{$name}").click(function() {
                var city = document.getElementById("bmap-address-{$name}").value;
                if (city != "") {
                    local.search(city);
                }
            });
            // 创建标注
            var create_mark = function(point) {
                // 清空所有标注
                map.clearOverlays();
                var marker = new BMap.Marker(point); // 创建标注
                map.addOverlay(marker); //添加标注
                marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
                // 写入坐标
                map_point.val(point.lng + "," + point.lat);
            };
            // 建立一个自动完成的对象
            var ac = new BMap.Autocomplete({
                "input": address_id,
                "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;
                search_result.html(str);
            });
            // 鼠标点击下拉列表后的事件
            var myValue;
            ac.addEventListener("onconfirm", function(e) {
                var _value = e.item.value;
                myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
                search_result.html("onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue);
                local.search(myValue);
            });
            // 监听点击地图时间
            map.addEventListener("click", function(e) {
                // 创建标注
                create_mark(e.point);
            });
            if (map_point.val() != '') {
                var curr_point = map_point.val().split(',');
                point_lng = curr_point[0];
                point_lat = curr_point[1];
                map_level = 16;
            } else if (address.val() != '') {
                local.search(address.val());
            } else {
                // 根据ip获取当前城市,并定位到当前城市
                var myCity = new BMap.LocalCity();
                myCity.get(function(result) {
                    var cityName = result.name;
                    map.setCenter(cityName);
                });
            }
            // 初始化地图,设置中心点坐标和地图级别
            var point = new BMap.Point(point_lng, point_lat);
            map.centerAndZoom(point, map_level);
            if (map_point.val() != '') {
                // 创建标注
                create_mark(point);
            }
            if (address.val() != '') {
                ac.setInputValue(address.val())
            }
        });
    });
     </script>
    EOT;
    }
    return <<<EOT
    $jscode
    <div class="js-bmap">
    		<input class="bmap-address" style="width:85%;float: left;" id="bmap-address-{$name}" name="{$name}_address" type="text" value="" placeholder="请输入要搜索的地址,或者手工在下面精准定位"> 
    		<div id="baaapsou-{$name}" class="baaapsou">搜索</div>
            <div class="searchResultPanel"></div>
            <input class="bmap-point" type="hidden" id="atc_{$name}" name="{$name}" value="{$info[$name]}">
            <div class="bmap" id="bmap-canvas-{$name}"></div>			
    </div>
    EOT;
    ;

    application\common\field\bmap\form.php

    阳光李林 消费:5554.91元 iPhone 2019-01-18 14:47
    同样的地址,第一个是你修改的这个,第二个是百度的两个有差异。
    阳光李林 消费:5554.91元 iPhone 2019-01-18 14:43
    我已经测试了,就是我说的这样很不错,非常感谢,但是搜索的地址好像跟百度有差异。
    阳光李林 消费:5554.91元 2019-01-18 14:44


    Suifeng 消费:23.24元 2019-01-18 14:45
    是有差异的
    Suifeng 消费:23.24元 2019-01-18 14:46
    地图接口和百度自己的地图 有点不一样
    阳光李林 消费:5554.91元 iPhone 2019-01-18 14:51
    非常感谢,一点小意思。电脑搜索加入回车键功能就更好了。
    阳光李林 消费:5554.91元 2019-01-19 11:44

    阳光李林 消费:5554.91元 iPhone 2019-01-19 11:45
    这个页面地图没有显示搜索按钮,希望也加上。
    Suifeng 消费:23.24元 2019-01-19 14:28
    style="width:85%;float: left;" 自己改小点 比如 style="width:60%;float: left;" 改为记得加锁 移动端我是模拟测试的是可以显示的
0 赏钱 赏礼回复
  • Suifeng 程序开发者 消费:23.24元 2019-01-18 13:18 13:186楼

    有地址没 去扒拉下来

    阳光李林 消费:5554.91元 iPhone 2019-01-18 13:20
    你好,什么意思?
    Suifeng 消费:23.24元 2019-01-18 13:35
    就是你上图的功能在哪个页面
    snscn 消费:1862.35元 其他手机 2019-01-18 13:36
    我给一个地址,我觉得这是最好的。
    https://ihuoniao.cn/sz/house/sale-detail-131.html
    电脑端,移动端都可以。
    粗略整了一次,没搞定。
    Suifeng 消费:23.24元 2019-01-18 13:37
    不对啊 现在的系统有搜索的啊
    阳光李林 消费:5554.91元 iPhone 2019-01-18 13:38
    没有搜索的,百度地图有的他会自动弹出来,点击才能用,如果输进去不能弹出来没有搜索的。
    阳光李林 消费:5554.91元 iPhone 2019-01-18 13:39
    有些时候弹出来的信息,不一定是准的。
    阳光李林 消费:5554.91元 iPhone 2019-01-18 13:40
    你自己测试一下吧,把地址填进去以后再电脑敲回车键,手机用键盘确定,地图都不会变化。
    snscn 消费:1862.35元 其他手机 2019-01-18 14:09
    @Suifeng 随风,看下爱火鸟地图,真的很实用。
0 赏钱 赏礼回复
更多回复
恢复多功能编辑器
  • 3 1
  • 线下拼团交流
        圈内贴子311
    • 圈子成员99
    本圈子内的新贴

    推荐内容
    扫一扫访问手机版
    请选择要切换的马甲:

     
    网页即时交流
    QQ咨询
    咨询热线
    020-28998648