基于jquery1.4.2的百度地图标点demo-----ajax更改后台地图坐标数据

最新推荐文章于 2023-06-06 14:17:21 发布

不想离开水的鱼

最新推荐文章于 2023-06-06 14:17:21 发布

阅读量1.5k

点赞数

分类专栏： jquery 前端资源备份文章标签： jquery 百度地图代码

本文链接：https://blog.csdn.net/ivyandrich/article/details/48140119

版权

前端同时被 3 个专栏收录

9 篇文章 0 订阅

订阅专栏

jquery

5 篇文章 0 订阅

订阅专栏

资源备份

2 篇文章 0 订阅

订阅专栏

总结的之前的一个功能，觉得比较有用，特此保留，如想测试，请自行更改代码中的jquery的地址

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
<script language="javascript" type="text/javascript" src="jquery-1.4.2.min.js"></script>
</head>
<body>

    <div class="f_companybg t10">
            <h3><em>公司地图</em>
<span id="ditu_set" style="cursor:pointer">重新设置标点</span>

<input type="button" value="定位" id="mapsearch_btn" class="g_dw_but"/><input id="mapsearch" type="text" class="g_dw_input"/>
</h3>

            <div  id='main_ditu' style="width:600px;height:400px"></div>
            <span id="confirm_position" style="cursor:pointer;position:absolute;right:30px;top:56px;background-color:#000;opacity:0.5;filter:alpha(opacity=50);border:1px solid #000000;width:80px;height:24px;line-height:20px;font-weight:bold;font-size:14px;color:#ffffff;padding-left:10px;display:none">确认此位置</span>
            <input type='hidden' id='position_lng' value='0'>
            <input type='hidden' id='position_lat' value='0'>
        </div>
        <script>
            var Map_val = {
                jing:116.348,
                wei:39.9822,
                ojing:116.348,
                owei:39.9822,
                map:null,
                point:null,
                marker:null,
                enableMapClick:0,
                subflag:0
            }
            $(document).ready(
                function()
                {
                    $.extend(
                        {
                            init_map:function()
                            {
                                Map_val.map = new BMap.Map("main_ditu");                    // 创建Map实例
                                Map_val.point = new BMap.Point(Map_val.jing,Map_val.wei);    // 创建点坐标
                                Map_val.map.centerAndZoom(Map_val.point,15);
                                if(Map_val.ojing > 0)
                                {
                                    Map_val.marker = new BMap.Marker(Map_val.point);  // 创建标注
                                    Map_val.map.addOverlay(Map_val.marker); 
                                }
                                Map_val.map.addControl(new BMap.NavigationControl());  //添加默认缩放平移控件
                                Map_val.map.disableDoubleClickZoom();
                                Map_val.map.disableContinuousZoom();
                                Map_val.local = new BMap.LocalSearch
                                (
                                    "全国", 
                                    {
                                        renderOptions:
                                       {
                                            map: Map_val.map,
                                            autoViewport: true,
                                            selectFirstResult: false
                                        }
                                    }
                                );
                            },
                            markerDragStart:function()
                            {
                                $("#confirm_position").slideUp();
                                return false;
                            },
                            markerDragEnd:function(e)
                            {
                                $("#position_lng").val(e.point.lng);
                                $("#position_lat").val(e.point.lat);
                                $("#confirm_position").slideDown();
                                return false;
                            }

                        }
                    );

                    $.init_map();



                    $("#mapsearch_btn").click(
                        function()
                        {
                            var search_val = $.trim($("#mapsearch").val());
                            if(search_val)
                            {
                                Map_val.local.search(_searchval);
                            }
                        }
                    );


                    $("#ditu_set").click(
                        function()
                        {
                            Map_val.enableMapClick = 1;
                            Map_val.map.addEventListener("click",
                                function(e)
                                {
                                    if(Map_val.enableMapClick == 0)
                                    {
                                        Map_val.map.removeEventListener("click", this);  
                                        return false;
                                    }
                                    //创建标注
                                    if(Map_val.marker)
                                    {
                                        Map_val.map.removeOverlay(Map_val.marker);  //移除旧标注
                                    }
                                    Map_val.point= new BMap.Point(e.point.lng, e.point.lat);
                                    Map_val.marker = new BMap.Marker(Map_val.point);  // 创建标注
                                    Map_val.map.addOverlay(Map_val.marker);           // 将标注添加到地图中
                                    //新添加标注添加事件
                                    Map_val.marker.enableDragging();
                                    Map_val.marker.addEventListener("dragstart",$.markerDragStart);
                                    Map_val.marker.addEventListener("dragend", $.markerDragEnd);

                                    $("#position_lng").val(e.point.lng);
                                    $("#position_lat").val(e.point.lat);
                                    $("#confirm_position").slideDown();

                                    return false;
                                }
                            );
                            Map_val.marker.enableDragging(); //标注拖动激活
                            Map_val.marker.addEventListener("dragstart",$.markerDragStart);
                            Map_val.marker.addEventListener("dragend",$.markerDragEnd);
                        }
                    );


                    $("#confirm_position").click(
                        function()
                        {
                            if(Map_val.subflag == 0)
                            {
                                Map_val.subflag = 1;
                                $(this).text("位置确认中");
                                var plng = $("#position_lng").val();
                                var plat = $("#position_lat").val();
                                Map_val.enableMapClick = 0; //禁止点击地图
                                Map_val.marker.disableDragging();  //禁止拖动标注
                                if(plng!=0 && plat!=0)
                                {
                                    //ajax提交数据
                                }
                            }
                        }
                    );


                }
            );

        </script>
</body>
</html>