- ·上一篇文章:Google 地图叠加层
- ·下一篇文章:Google 地图控件集
当前位置:K88软件开发 → 文章中心 → 编程语言 → JavaScript → JS02 → 文章内容
Google 地图事件
a.menu_google_maps_events{font-weight:
bold;}Google 地图事件点击标记缩放地图 - 绑定在google地图上的事件。点击标记缩放地图我们仍然使用上一遍文章使用的英国伦敦的地图。点用户点击标记时实现缩放地图的功能(点击标记时绑定地图缩放事件)。代码如下:实例// Zoom to 9 when clicking on markergoogle.maps.event.addListener(marker,'click',function() {map.setZoom(9);map.setCenter(marker.getPosition());});尝试一下 ?使用 addListener() 事件处理程序来注册事件的监听。该方法使用一个对象,一个事件来监听,当指定的事件发生时函数将被调用。重置标记我们通过给地图添加事件处理程序来改变 'center' 属性,以下代码使用 center_changed 事件在3秒后标记移会中心点:
实例google.maps.event.addListener(map,'center_changed',function() {window.setTimeout(function() {map.panTo(marker.getPosition());},3000);});尝试一下 ?点击标记时打开信息窗口。点击标记在信息窗口显示一些文本信息:实例var infowindow = new google.maps.InfoWindow({content:
"Hello World!"});google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,marker);});尝试一下 ?设置标记及打开每个标记的信息窗口当用户点击地图时执行一个窗口用户点击地图某个位置时使用 placeMarker() 函数在指定位置上放置一个标记,并弹出信息窗口:实例google.maps.event.addListener(map, 'click', function(event) {placeMarker(event.latLng);});function placeMarker(location) {var marker = new google.maps.Marker({position:
location,map:
map,});var infowindow = new google.maps.InfoWindow({content:
'Latitude:
' + location.lat() +'<br>Longitude:
' + location.lng()});infowindow.open(map,marker);}尝试一下 ?Google 地图 - 事件参考手册Google Maps API 参考手册。
bold;}Google 地图事件点击标记缩放地图 - 绑定在google地图上的事件。点击标记缩放地图我们仍然使用上一遍文章使用的英国伦敦的地图。点用户点击标记时实现缩放地图的功能(点击标记时绑定地图缩放事件)。代码如下:实例// Zoom to 9 when clicking on markergoogle.maps.event.addListener(marker,'click',function() {map.setZoom(9);map.setCenter(marker.getPosition());});尝试一下 ?使用 addListener() 事件处理程序来注册事件的监听。该方法使用一个对象,一个事件来监听,当指定的事件发生时函数将被调用。重置标记我们通过给地图添加事件处理程序来改变 'center' 属性,以下代码使用 center_changed 事件在3秒后标记移会中心点:
实例google.maps.event.addListener(map,'center_changed',function() {window.setTimeout(function() {map.panTo(marker.getPosition());},3000);});尝试一下 ?点击标记时打开信息窗口。点击标记在信息窗口显示一些文本信息:实例var infowindow = new google.maps.InfoWindow({content:
"Hello World!"});google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,marker);});尝试一下 ?设置标记及打开每个标记的信息窗口当用户点击地图时执行一个窗口用户点击地图某个位置时使用 placeMarker() 函数在指定位置上放置一个标记,并弹出信息窗口:实例google.maps.event.addListener(map, 'click', function(event) {placeMarker(event.latLng);});function placeMarker(location) {var marker = new google.maps.Marker({position:
location,map:
map,});var infowindow = new google.maps.InfoWindow({content:
'Latitude:
' + location.lat() +'<br>Longitude:
' + location.lng()});infowindow.open(map,marker);}尝试一下 ?Google 地图 - 事件参考手册Google Maps API 参考手册。
Google 地图事件