日韩a天堂2020在线手机

当前位置:美女AV > IT相关 > 地图开发 > 正文  |  快速导航:行业资讯 软件测试 风云人物 计算机英语 游戏开发 移动应用 地图开发 算法 程序员
  • 谷歌(Google)地图实例 API V3

  • 字号:[ ]2013-2-2 18:57:15  阅读:808次  来源:乐猪网  编辑:银河精灵  收藏
  • 摘要:刚开始以为需要自己注册就可以进行发布使用,但后来我看到一篇文章说,需要注册网站或者域网就可以发布正常使用,可是我打开谷歌申请密钥的网站时,已经停止申请了。原来现在已经有V3 的版本了,V2 将停用,不过还是提供API,可以本地展示。
  •       今天下班后心情特别的好,吃饭特香,明天就是公司年会了,开完年会接着就开始放假过年了,结束这一年来的编程日韩a天堂2020在线手机工作,迎下一年的到来,哈哈!

          我们接着上一篇《谷歌(Google)地图实例 API V2日韩a天堂2020在线手机》文章来讲一下谷歌地图 API V3吧!在上篇文章已经说过V2 使用的密钥不再提供申请了!

     

    以下是谷歌(Google)地图实例代码引用片段:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <title>地图定位</title>
        <style type="text/css">
        html,body{
            margin:0px;
            height:100%;
        }
        #map_canvas{
            width:100%;
            height:100%;
            MARGIN: 0px auto;
        }
        </style>
        <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&language=zh"></script>
        <script language="javascript" type="text/javascript">
        <!--
        /*
      latitude 纬度 
      longitude 经度 
      title 悬浮在标记图标上显示的内容
      openInfo 提示窗口内容(InfoWindow)
     **/
     var map, latitude, longitude, title, addDate, openInfo;
     
     
     //获取Url值
        function GetRequest() {
            var url = location.search; //获取url中"?"符后的字串
            var theRequest = new Object();
            if (url.indexOf("?") != -1) {
                var str = url.substr(1);
                strs = str.split("&");
                for(var i = 0; i < strs.length; i ++) {
                    theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
                }
            }
            return theRequest;
        }
     
     //加载地图
     function initialize() {
            //获取URL信息
            var Request = new Object();
            Request = GetRequest();
            title = Request['SerialNumber'];
            longitude = Request['X'];
            latitude = Request['Y'];
            addDate = Request['AddDate'];
            openInfo = '<div>'+
            '<a>设备序列号:'+ title +'</a><br/>'+
            '<a>纬度:'+latitude +'</a><br/>'+
            '<a>经度:'+longitude +'</a><br/>'+
            '<a>时间:'+addDate +'</a>'+
            '</div>';

      //地图定位
      var myLatlng = new google.maps.LatLng(latitude, longitude);
      var myOptions = {
        zoom : 6,   //地图的缩放程度
        center : myLatlng, //地图中心位置
        mapTypeId : google.maps.MapTypeId.HYBRID, //地图类型(ROADMAP、HYBRID)
        mapTypeControl:false //隐藏切换地图
         };

      //把地图绑定在ID为map_canvas的DIV上
      map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);

      //显示地址的标记图标
      var marker = new google.maps.Marker({
             position: myLatlng, 
             map: map, 
             title:title
             //  icon: 'http://google-maps-icons.googlecode.com/files/factory.png'   //自定义标记图标
         });

      var infowindow = new google.maps.InfoWindow({    //InfoWindow 内容提示
       content: openInfo,
       position: myLatlng
      }); 
      
      infowindow.open(map); //显示提示主窗口

      //给marker添加点击事件
         google.maps.event.addListener(marker, 'click', function() {
          infowindow.open(map); //如果提示窗口关闭了,点击标记图标可再次显示提示主窗口
      }); 
     }
        //-->
        </script>
    </head>
    <body onload="initialize()" scroll="no">
        <div id="map_canvas">
        </div>
    </body>
    </html>

     

    点击新窗口打开大图

  • 顶一下
    (0)
    0%
    踩一下
    (0)
    0%
乐猪网 版权所有 Copyright © 2012-2015 msox106.cn All rights reserved.
本站用于学习交流,部分文章来源于网络,如果不慎侵犯了您的权益,请AV视频 我们删除!
粤ICP备12000837号

日韩a天堂2020在线手机