Google地图:设置中心,设置中心点和设置更多点 [英] Google Maps: Set Center, Set Center Point and Set more points
本文介绍了Google地图:设置中心,设置中心点和设置更多点的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我使用的是Google Maps V3,我希望:
I am using Google Maps V3 and I want to:
-
将地图的中心设置为特定的latlng。我正在使用:
Set the center of the map to a particular latlng. I am using:
map.setCenter(new google.maps.LatLng(mylat,mylong));
在该中心点设置一个点。我目前使用:
Set a point in that center spot. I am currently using:
var point = new google.maps.LatLng(mylat,mylong);
marker = map_create_marker(point,"My Popup",map_icon_red);
使用此功能:
With this function:
function map_create_marker(point,html,icon) {
var marker = new google.maps.Marker({
position: point,
map: map,
icon: icon,
shadow: map_icon_shadow
});
if(html!="") {
var infowindow = new google.maps.InfoWindow({
content: html
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
return marker;
}
使用上面相同的方法放置更多标记
Position many more markers using the same method above
问题是,当我像上面那样设置中心时,它只显示第一个标记。但是如果我不设置中心,它会显示所有标记。我怎样才能让他们工作?
The problem is that when I set the center like above, it only ever displays the first marker. But if I don't set a center it displays all the markers. How can I get them to both work?
以下是完整的javascript代码:
Here is the full javascript code:
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" language="JavaScript">
var map;
var map_icon_green = new google.maps.MarkerImage(
"http://mysite.com/green_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_blue = new google.maps.MarkerImage(
"http://mysite.com/blue_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_yellow = new google.maps.MarkerImage(
"http://mysite.com/yellow_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_red = new google.maps.MarkerImage(
"http://mysite.com/red_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_shadow = new google.maps.MarkerImage(
"http://mysite.com/shadow.png",
new google.maps.Size(28,20),
new google.maps.Point(-6,0));
var map_crosshair = new google.maps.MarkerImage(
"http://mysite.com/cross-hair.gif",
new google.maps.Size(17,17),
new google.maps.Point(0,0));
function map_loader() {
var myOptions = {
zoom: 5,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scrollwheel:false
}
map = new google.maps.Map(
document.getElementById('map_container'), myOptions);
map.setCenter(new google.maps.LatLng(53.0,-1.0));
// <![CDATA[
var point = new google.maps.LatLng(53.0,-4.0755);
marker = map_create_marker(point,"some html which is OK",map_icon_red);
// ]]>
// <![CDATA[
var point = new google.maps.LatLng(-24.0,25.0);
marker = map_create_marker(point,"some html which is OK",map_icon_red);
// ]]>
// <![CDATA[
var point = new google.maps.LatLng(54.0,-2.0);
marker = map_create_marker(point,"some html which is OK",map_icon_red);
// ]]>
map.disableDoubleClickZoom = false;
}
function map_create_marker(point,html,icon) {
var marker = new google.maps.Marker({
position: point,
map: map,
icon: icon,
shadow: map_icon_shadow
});
if(html!="") {
var infowindow = new google.maps.InfoWindow({
content: html
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
return marker;
}
var map_set_center = 0;
function map_load_resize() {
if(map_set_center==0) {
map.setCenter(new google.maps.LatLng(53.0,-1.0));
}
map_set_center = 1;
}
</script>
推荐答案
请尝试使用v3代码:
gMap = new google.maps.Map(document.getElementById('map'));
gMap.setZoom(13); // This will trigger a zoom_changed on the map
gMap.setCenter(new google.maps.LatLng(37.4419, -122.1419));
gMap.setMapTypeId(google.maps.MapTypeId.ROADMAP);
这篇关于Google地图:设置中心,设置中心点和设置更多点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文