Google Maps API V3 的事件

发布时间:2016-12-9 6:07:52 编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"Google Maps API V3 的事件",主要涉及到Google Maps API V3 的事件方面的内容,对于Google Maps API V3 的事件感兴趣的同学可以参考一下。

Google Maps API V3 的事件模型 有两种类型的事件: 1、用户事件 2、MVC 状态更改 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default4.aspx.cs" Inherits="Default4" %> <!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></title> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3.9&sensor=true"></script> <script type="text/javascript"> var map; //地图初始化 function initialize() { var mapOptions = { center: new google.maps.LatLng(24.886436490787712, -70.2685546875), zoom: 3, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); //创建标注 var marker = new google.maps.Marker({ position: map.getCenter(), map: map, title: 'Click to zoom' }); //为map地图添加缩放级别更改事(2、MVC 状态更改) //MVC 对象通常都包含状态。只要更改了对象的属性,API 就会触发已更改该属性的事件。 //例如,当地图的缩放级别更改后,API 将会触发地图上的 zoom_changed 事件。 //您也可以在 event 命名空间方法中注册 addListener() 事件处理程序,以拦截这些状态更改。 google.maps.event.addListener(map, 'zoom_changed', function () { alert("点击了地图"); }); //为marker添加点击事件(1、用户事件) //Maps API 中的一些对象旨在对用户事件(例如鼠标事件或键盘事件)作出响应 google.maps.event.addListener(marker, 'click', function () { alert("你点击了标注"); }); //通常情况下,Google Maps API V3 中的用户界面事件会传递事件参数,您可通过事件监听器访问该参数(其中注明了事件发生时的用户界面状态)。 //例如,用户界面 'click' 事件通常会传递一个包含 latLng 属性的 MouseEvent,该属性指示了地图上的点击位置。 google.maps.event.addListener(map, 'click', function (event) { placeMarker(event.latLng); }); } function placeMarker(location) { var marker = new google.maps.Marker({ position: location, map: map }); map.setCenter(location); } </script> </head> <body onload="initialize()" style="margin:0 auto"> <form id="form1" runat="server"> <div id="map_canvas" style="width:100%; height:100%;left:0px;top:0px;position:absolute;"></div> </form> </body>> </html>  

上一篇:
下一篇:最新研究:在手机上,Data-url和CSS Sprites哪一个更快?

相关文章

相关评论