堆栈溢出与谷歌地图API（IE7 IE8） [英] stack overflow with Google maps API (IE7 IE8)
问题描述
我一直在与我们网站上的谷歌地图争论，这是在IE7和IE8首次加载时发生的。我试图通过组合firefox和ie8调试器来处理解决方案，但是这很困难（我的老板也在推动我解决其他问题）因为JS被缩小了，IE调试器无法做到这一点。
我们有两个版本的同一个网站，一个在irelandhotels.com，开发环境在groupbke.young.netaffinity.net。
第一个有500多个标记，开发环境只有5个左右。但是问题出现在两个站点上。
I've been fighting an issue with google maps on our site which occurs on first load on IE7 and IE8. I was trying to deal with the solution by combining firefox and ie8 debuggers, but it's quite difficult (and my boss is pushing me on other issues as well) as the JS is minified and IE debugger cant do a thing about it. We have two versions of the same site, one at irelandhotels.com and the dev environment at groupbke.young.netaffinity.net. First one has 500+ markers, the dev environment only 5 or so. However the issue occurs on both sites.
执行将进入函数yf，然后进入一个包含3个未命名函数的循环。
The execution will go into function yf, and then get into a loop with 3 unnamed functions.
我在这里找到了一篇关于这个问题的有趣文章：
http://cappuccino.org/discuss/2010/03/01/internet-explorer-global-variables-and-stack-overflows/
I found an interesting article here about the issue: http://cappuccino.org/discuss/2010/03/01/internet-explorer-global-variables-and-stack-overflows/
我们的地图初始化代码在这里：
http://groupbke.young.netaffinity.net/bookings/googlemap
Our maps initialization code is here: http://groupbke.young.netaffinity.net/bookings/googlemap
我有一些图片，到目前为止无法发布，也没有链接他们：/
I have some images, just cannot post them so far, nor the link for them :/
非常感谢任何帮助。
Gergely
推荐答案
过去我总是如此做过这样的事情：
How I've always done this in the past is like this:
function initialize(mapid) {
// make this local to your initialize function
var hoteldata = [
['Griffen Hotel S1', 53.27093787103, -6.30448181406804, 'Lorem Ipsum', 1],
['Young Testing Hotel - Liège', 53.33932, -6.261427, 'Lorem Ipsum', 4]
];
var myOptions = {
zoom: 15, // according to the documentation zoom and center are required when creating instances of the Map class
center: new google.maps.LatLng(50.820645,-0.137376),
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false
};
var bounds = new google.maps.LatLngBounds();
var map = new google.maps.Map(document.getElementById(mapid), myOptions);
var infowindow = new google.maps.InfoWindow();
var markers = [];
var i, latLng, img;
for (i = 0; i < hoteldata.length; i++) {
latLng = new google.maps.LatLng(hoteldata[i][1], hoteldata[i][2]);
bounds.extend(latLng);
// why not use a switch here?
img = '/images/hotel-marker.png';
if (hoteldata[i][4] == 2) {
img = '/images/country-marker.png';
}
if (hoteldata[i][4] == 3) {
img = '/images/guesthouse-marker.png';
}
if (hoteldata[i][4] == 4) {
img = '/images/hotel-self-marker.png';
}
var marker = new google.maps.Marker({
position: latLng,
icon: img,
shadow: '/images/marker-shadow.png'
});
markers.push(marker);
bindInfoWindow(marker, map, infowindow, hoteldata[i][3]);
}
map.fitBounds(bounds);
}
function bindInfoWindow(marker, map, infowindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(html);
infowindow.open(map, marker);
});
}
此外，（虽然你说这不是问题）IE讨厌数组或者以尾随逗号结尾的结构。
Also, (although you say this isn't the problem) IE hates arrays or structures which end with a trailing comma.
var hoteldata = [
['Griffen Hotel S1', 53.27093787103, -6.30448181406804, '<div class="nearby-hotel"> <h1><a href="/hotels/ireland/dublin/dublin/griffen-hotel-s1">Griffen Hotel S1</a></h1> <div class="star-rating-0"></div><div class="clear"></div> <div class="nearby-hotel-image l"> <a href="/hotels/ireland/dublin/dublin/griffen-hotel-s1"><img src="http://groupbke.young.netaffinity.net/images/placeholder-60px.jpg" border="1" class="imagetype1"/></a> </a> </div> <div class="nearby-hotel-description l"> <a class="nearby-hotel-desc" href="/hotels/ireland/dublin/dublin/griffen-hotel-s1">Located in the heart of the city, this charming 100 executive Bedroom hotel is just a minute\'s walk from the main shopping and business districts. Just step into the reception area and immediately you will know that you are somewhere very special. The beautiful reception area invites you to relax with the daily paper or a soothing drink whilst you contemplate your day. With sumptuous executive hotel rooms and something for all the family, the Griffen Hotel undoubtedly earns its reputation as one of the cities finest. </a> <a href="/hotels/ireland/dublin/dublin/griffen-hotel-s1" class="btn-small">Book Now</a> </div> <div class="clear"></div> </div>', ],
...
];
删除最后一个，就在第一次收盘前......所以它看起来像：
Remove that last , just before the first closing ] so it looks like:
var hoteldata = [
['Griffen Hotel S1', 53.27093787103, -6.30448181406804, '<div class="nearby-hotel"> <h1><a href="/hotels/ireland/dublin/dublin/griffen-hotel-s1">Griffen Hotel S1</a></h1> <div class="star-rating-0"></div><div class="clear"></div> <div class="nearby-hotel-image l"> <a href="/hotels/ireland/dublin/dublin/griffen-hotel-s1"><img src="http://groupbke.young.netaffinity.net/images/placeholder-60px.jpg" border="1" class="imagetype1"/></a> </a> </div> <div class="nearby-hotel-description l"> <a class="nearby-hotel-desc" href="/hotels/ireland/dublin/dublin/griffen-hotel-s1">Located in the heart of the city, this charming 100 executive Bedroom hotel is just a minute\'s walk from the main shopping and business districts. Just step into the reception area and immediately you will know that you are somewhere very special. The beautiful reception area invites you to relax with the daily paper or a soothing drink whilst you contemplate your day. With sumptuous executive hotel rooms and something for all the family, the Griffen Hotel undoubtedly earns its reputation as one of the cities finest. </a> <a href="/hotels/ireland/dublin/dublin/griffen-hotel-s1" class="btn-small">Book Now</a> </div> <div class="clear"></div> </div>'],
...
];
这篇关于堆栈溢出与谷歌地图API（IE7 IE8）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
