您好我有这个Gmap v3代码,只在Firefox中显示多个标记(20个标记),并且一段时间后不会立即显示。
var geocoder;
var map;
//var map2;
var places = [];
var popup_price = [];
var popup_rooms = [];
var popup_area = [];
var popup_pic = [];
var popup_description = [];
var address = [];
var address_position = 0;
var timeout = 600;
var myStyles =[
{
featureType: "transit",
elementType: "label",
stylers: [
{ visibility: "on" }
]
}
];
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(42.36741824284927, -71.071085890625);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: 'roadmap',
streetViewControl: false,
styles: myStyles
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
addMarker(address_position);
}
function addMarker(position)
{
geocoder.geocode({'address': address[position]}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
places[position] = results[0].geometry.location;
//map.addOverlay(new MarkerLight(latlng, {image: "red_dot.png"})); if slow actual implemetation then follow http://www.svennerberg.com/2009/01/handling-large-amounts-of-markers-in-google-maps/
var marker = new google.maps.Marker({
position: places[position],
//content:html,
map: map
});
// Creating an InfoWindow object
var infowindow = new google.maps.InfoWindow({
content: '<div style="font-family:arial;font-size:11px;color:#333333;"><div style=float:left;width:83px;><img src=/listings/'+popup_pic[position]+'.jpg.rbm?w=80&h=80&f=cover > </div><div style=float:left;width:205px;text-align:justify;padding:5px;><strong>$'+popup_price[position] +'<br>'+popup_rooms[position]+'</strong><br>'+popup_area[position]+'<br>'+popup_description[position]+'...</div><div style="float:left;width:96px;"><img src="/upload/custom_screens/rb/viewBtnMap.gif" class="imgPopup"><img src="/upload/custom_screens/rb/saveBtnMap.gif" class="imgPopup"><img src="/upload/custom_screens/rb/reqBtnMap.gif" class="imgPopup"></div></div>',
maxWidth: 400
});
google.maps.event.addListener(marker, 'click', function()
{
infowindow.open(map, marker);
});
//infowindow.open(map,marker);
google.maps.event.addListener(map, 'zoom_changed', function() {
zoomLevel = map.getZoom();
if (zoomLevel >= 16)
{
marker.setVisible(false);
var circleOptions =
{
strokeColor: "#c4c4c4",
strokeOpacity: 0.35,
strokeWeight: 0,
fillColor: "#ca0d33",
fillOpacity: 0.1,
map: map,
center: results[0].geometry.location,
radius: 50
};
//add draw circle
var circle = new google.maps.Circle(circleOptions);
circle.bindTo('center', marker, 'position');
}
else
{
//circle.setMap(null);
marker.setVisible(true);
}
});
}
}
else
{
if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT)
{
setTimeout(function() { addMarker(position); }, (timeout * 3));
}
}
address_position++;
if (address_position < address.length)
{
setTimeout(function() { addMarker(address_position); }, (timeout));
}
});
}
如何提高速度并让它们在IE和Chrome中运行?我在控制台中没有收到任何错误。
谢谢
答案 0 :(得分:1)
目前您的地图没有为我显示任何标记,因为地址为空。我正在用一些值测试它:
var address = ['Brookline','Wayland','Bedford'];
...所有3个标记出现在IE,Chrome,FF&amp;戏。
然而,主要的问题是你使用地址而不是LatLng,因为地址首先必须通过地理编码来获取LatLng,而且地址不是唯一的,你可能会收到不断变化的结果(例如结果可能会发生返回视口外的其他位置,您无法识别它。)
因此,如果地址在您的应用程序中已知,您最好存储这些地址的LatLng并根据这些位置显示标记(因为您不需要地理编码也应该更快)