Google 地图事件

点击标记缩放地图 - 绑定在google地图上的事件。

点击标记缩放地图

我们仍然使用上一遍文章使用的英国伦敦的地图。

点用户点击标记时实现缩放地图的功能(点击标记时绑定地图缩放事件)。

代码如下：

实例

//
Zoom to 9 when clicking on marker


google
.
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 参考手册。