zoukankan      html  css  js  c++  java
  • 初识 GoogleMap

             GoogleMap的文档写的相当好,照着做基本上没什么问题,就当记事本了。

    View Code
     1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     2 <html>
     3  <head>
     4   <title>Hello World</title>
     5   <style type="text/css">
     6    html{height:100%}
     7    body{height:100%;margin:0px;padding:0px}
     8    #map_canvas{height:100%}
     9    </style>
    10    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
    11    </script>
    12    <script type="text/javascript">
    13     function initialize(){
    14       var latlng=new google.maps.LatLng(-34.37,150.644);
    15       var myOptions={
    16         zoom:12,
    17         center:latlng,
    18         mapTypeId:google.maps.MapTypeId.ROADMAP
    19       };
    20       var map=new google.maps.Map(document.getElementById("map_canvas"),myOptions);
    21     }
    22     </script>
    23  </head>
    24 
    25  <body onload="initialize()">
    26   <div id="map_canvas" style="100% ;height:100%"></div>
    27  </body>
    28 </html>

    1:当然要引入Google Map API .

    2:创建LatLng对象,这是最重要的,包含经纬度,Google就是通过它来定位的。

    3:创建Map Options,包括zoom(地图的放大倍数1-15),center(包含经纬度的对象),mapTypeId(地图类型:包括

    • ROADMAP displays the normal, default 2D tiles of Google Maps.
    • SATELLITE displays photographic tiles.
    • HYBRID displays a mix of photographic tiles and a tile layer for prominent features (roads, city names).
    • TERRAIN displays physical relief tiles for displaying elevation and water features (mountains, rivers, etc.).

    4:创建Map对象。

  • 相关阅读:
    linux下ssh端口的修改和登录
    linux找回密码
    XAMPP命令之LAMPP
    VirtualBox 复制vdi文件和修改vdi的uuid
    探讨PHP页面跳转几种实现技巧
    CSS盒模型和margin重叠
    8--数组旋转
    9--斐波那契数列
    7--动态规划
    6--树的遍历
  • 原文地址:https://www.cnblogs.com/az19870227/p/2032776.html
Copyright © 2011-2022 走看看