gMap Google地图从地图外链接中选择

时间:2010-12-05 01:04:12

标签: google-maps jquery-gmap

我正在使用gMap。我认为我有以下内容:

<script>
$("#map4").gMap({ markers: [{ latitude: 47.651968,
                                  longitude: 9.478485,
                                  html: "<a href='abc'>ABC</a>" },
                      zoom: 10 });
</script>

<div id="abc">
<a href="">ABC</a>
Description for ABC
</div>

从地图中,我可以点击信息窗口中滚动到Id'ed DIV的链接。我还想点击地图外的ABC链接,点击后,它会显示ABC在地图中的位置(例如infowindow将显示)。

我如何实现这一目标?感谢。

2 个答案:

答案 0 :(得分:2)

虽然回复较晚,但未来可能对某人有所帮助。 你可以使用像..

这样的东西
google.maps.event.trigger(markers[i], 'click');

其中markers是地图上标记的数组。

在链接点击上调用上面的代码。

答案 1 :(得分:0)

你基本上必须将地图的中心设置为新的Lat和Lon。像这样:

map.setCenter(new google.maps.LatLng(this.latitude, this.longitude));

只需打开信息窗口

myInfoWindow.open(map, yourMarker);

通过使用javascript,您可以向<a>的onClick添加活动,并使用新的中心设置地图。

更新w /示例:http://jsfiddle.net/kjy112/FEexA/

HTML:为我们的谷歌地图创建一个div,还有一个中心/信息赢取弹出窗口的链接。

<div id='map_canvas'></div>
<a id='marker' href='javascript:showMarker();'>Click Me!</a>

CSS:设置Google地图区域的维度

#map_canvas{
    width: 400px;
    height: 400px;
}

Javascript操作: 用一些随机的lat lon设置地图

var map = new google.maps.Map(document.getElementById('map_canvas'), {
    zoom: 10,
    center: new google.maps.LatLng(35.137879, -82.836914),
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

使用信息窗口创建我们的标记:

var myMarker = new google.maps.Marker({
    position: new google.maps.LatLng(47.651968, 9.478485),
});

myMarker['infoWin'] = new google.maps.InfoWindow({
    content: "<div id='infoWindow'>Your Info Window!</div>"
});

这是处理“Click Me!”时的代码。单击锚点:

function showMarker() {
    map.setCenter(myMarker.position); //makes myMarker center of map
    myMarker.setMap(map); //add the marker to the map
    myMarker['infoWin'].open(map, myMarker); //opens the info window associate with the marker
}