zoukankan      html  css  js  c++  java
  • Google Maps API V3学习 简单的地图

    技术发展日新月异,为了与时俱进,不让自己很快的落伍,正好项目有所需要,就学习了下 新发布的Google Maps API V3。

          V3相对于V2存在许多改变,比如在地图的加载上,尤其是手机浏览器访问的速度更快了(参考自其说明文档)。

    从开发上,V3版不再需要获取API的Key(以往每部署一套程序,都得去申请一个key,麻烦的很),V3所有都在google.maps.*的命名空间下,

    没有以“G”为前缀的全局变量了,所以以往的v2代码都不能复用,需要进行一定的修改。

     

    • <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
    •  
    • <!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 runat="server"
    •     <title>Google 地图 JavaScript API 示例: 简单的地图</title> 
    •     <%-- 加载 Google 地图 API JavaScript--%> 
    •  
    •     <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=zh-CN"></script> 
    •  
    •     <script type="text/javascript"
    •     var map; 
    •     //地图初始化 
    •     function initialize() { 
    •         var mapOptions = {       
    •             zoom: 14,                //缩放级别   
    •             center: new google.maps.LatLng(39.917, 116.397),       //将地图的中心设置为指定的地理点 可以使用 0(最低缩放级别,在地图上可以看到整个世界)到 19(最高缩放级别,可以看到独立建筑物)之间的缩放级别 
    •             mapTypeId: google.maps.MapTypeId.SATELLITE,   //ROADMAP-默认视图 SATELLITE-显示Google地球卫星图像 HYBRID-混合显示普通视图和卫星视图 TERRAIN-地形图  
    •             scaleControl: true,    //比例尺 
    •             mapTypeControl: true,     
    •             mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU} 
    •         }; 
    •         map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions);//编写 JavaScript 函数创建“map”对象 
    •     }   
    •  
    •      
    •    </script> 
    •  
    • </head> 
    • <body onload="initialize()"
    •     <form id="form1" runat="server"
    •     <%--创建名为“map_canvas”的 div 元素来包含地图--%> 
    •     <div id="map_canvas" style=" 800px; height: 600px"
    •     </div> 
    •     </form> 
    • </body> 
    • </html>

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=zh-CN"></script>

    其中sensor这个参数是必须的,如果应用程序是通过使用的传感器(如GPS定位仪)来确定用户的位置,就设为true。一般我们不做移动设备开发的话都设置为false。我们可以通过设置语言(language)或者是区域代码(region)来本地化地图应用,这两个参数是可选的。

     

     

  • 相关阅读:
    天生我材必有用?
    峨眉山徒步之行
    S3C6410 GPIO操作接口
    工作
    奖金
    吝啬的地主
    聪明的小李
    地铁重组
    灵魂分流药剂
    摆渡线路
  • 原文地址:https://www.cnblogs.com/bailuobo/p/2584225.html
Copyright © 2011-2022 走看看