zoukankan      html  css  js  c++  java
  • 百度地图调用js代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>百度地图调用</title>
        <style type="text/css">
            html
            {
                height: 100%;
            }
            body
            {
                height: 50%;
                margin: 0px;
                padding: 0px;
            }
            #container
            {
                600px;
                height: 500px;
            }
        </style>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
    </head>
    <body onload="loand()">
        <div id="container">
        </div>
        <input id="lng" type="hidden" runat="server" />
        <input id="lat" type="hidden" runat="server" />
        <input id="Button1" type="button" value="标记图标"  runat="server" onclick="getbiaoji()" />
        <script type="text/javascript">

            function getbiaoji() {
                var lng = document.getElementByIdx_x("lng").value;
                var lat = document.getElementByIdx_x("lat").value;

                var map = new BMap.Map("container");
                var point = new BMap.Point(lng, lat);
                var marker = new BMap.Marker(point);
                var opts = {
                    250,     // 信息窗口宽度 
                    height: 100,     // 信息窗口高度 
                    title: "经销商地址"  // 信息窗口标题 
                }
                var infoWindow = new BMap.InfoWindow("移动拖拽 标记经销商地址:" + lng + lat, opts);  // 创建信息窗口对象


                marker.enableDragging(); //启用拖拽
                map.addControl(new BMap.NavigationControl()); //左上角控件
                map.enableScrollWheelZoom(); //滚动放大
                map.enableKeyboard(); //键盘放大

                map.centerAndZoom(point, 13); //绘制地图
                map.addOverlay(marker); //标记地图

                map.openInfoWindow(infoWindow, map.getCenter());
            }

            function loand() {
                var map = new BMap.Map("container");
                var point = new BMap.Point(104.083, 30.686); //默认中心点
                var marker = new BMap.Marker(point);
                var opts = {
                    250,     // 信息窗口宽度 
                    height: 100,     // 信息窗口高度 
                    title: "经销商地址"  // 信息窗口标题 
                }
                var infoWindow = new BMap.InfoWindow("移动拖拽 标记经销商地址", opts);  // 创建信息窗口对象


                marker.enableDragging(); //启用拖拽
                marker.addEventListener("dragend", function (e) {
                    point = new BMap.Point(e.point.lng, e.point.lat); //标记坐标(拖拽以后的坐标)
                    marker = new BMap.Marker(point);

                    document.getElementByIdx_x("lng").value = e.point.lng;
                    document.getElementByIdx_x("lat").value = e.point.lat;
                    infoWindow = new BMap.InfoWindow("当前位置<br />经度:" + e.point.lng + "<br />纬度:" + e.point.lat, opts);

                    map.openInfoWindow(infoWindow, point);
                })

                map.addControl(new BMap.NavigationControl()); //左上角控件
                map.enableScrollWheelZoom(); //滚动放大
                map.enableKeyboard(); //键盘放大

                map.centerAndZoom(point, 13); //绘制地图
                map.addOverlay(marker); //标记地图

                map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口     
            }
            
        </script>
    </body>
    </html>

  • 相关阅读:
    发送电子邮件
    PHP Session
    Cookie
    Python基础语法
    Python中文编码
    Python简介
    PHP文件上传
    基于1.22.1版本的k8s部署
    k8s基于NFS创建动态存储StorageClass
    关于在k8s-v1.20以上版本使用nfs作为storageclass出现selfLink was empty, can‘t make reference
  • 原文地址:https://www.cnblogs.com/wenson/p/3305912.html
Copyright © 2011-2022 走看看