Question

我在地图上显示不同的标记，问题是有时（特别是当我重置网络服务器时）地图正确加载，它甚至显示了点的阴影，但标记没有显示/可见map.However然后在后续调用中正确显示标记（可能缓存，但不确定）。这种行为在所有浏览器中都是一致的，即IE 6/7/8，Chrome，Firfox 3.5.6。

下面显示的javascript会创建标记。在边线上，由于标记可以具有不同的尺寸，我需要首先确定宽度和尺寸（否则它们看起来变形）。

var imgTemp = new Image();
imgTemp.name = "img_" + i.toString();
imgTemp.src = groupMarkerUrl; //url to the actual image

point = new GLatLng(parseFloat(latitude), parseFloat(longitude));
var icon = new GIcon(G_DEFAULT_ICON);
icon.image = groupMarkerUrl;
icon.iconSize = new GSize(imgTemp.width, imgTemp.height); //Width x Height
icon.iconAnchor = new GPoint(14, 15);
icon.infoWindowAnchor = new GPoint(5, 1);
marker = new GMarker(point, icon);
map.setCenter(point, 13);

//build the information box
var htmlContent = "<div style=\"color:#000000\"><span style=\"font-weight:bold;\">" + title + "</span><br/>";
if (address != "") {
    htmlContent += address + " ";
}
if (zipcode != "") {
    htmlContent += "<br/>" + zipcode + ", ";
}
if (city != "") {
    htmlContent += city;
}
if (telephone != "") {
    htmlContent += "<br/>Tel : " + telephone;
}
if (fax != "") {
    htmlContent += "<br/>Fax : " + fax;
}

htmlContent += "</div>";

map.addOverlay(marker);

markerKeys.push(stamp);

markers[stamp] = marker;
//Add legends with group markers one for each group
if (null == legends[groupId]) {

    legends[groupId] = groupMarkerUrl;
    var nbsp = document.createTextNode("  ");
    var image = document.createElement("img");
    image.setAttribute("src", groupMarkerUrl);
    image.setAttribute("style", "margin-left:10px !important; border:\"0\";");

    pushpinPnlConsole.appendChild(nbsp);
    pushpinPnlConsole.appendChild(image);

    pushpinPnlConsole.setAttribute("style", "display:block");

}

eval("GEvent.addListener(markers[stamp] , \"click\", function(){markers['" + stamp + "'].openInfoWindowHtml(windowHtmls['" + stamp + "']);});");
windowHtmls[stamp] = htmlContent;
opticianTBody.appendChild(row);

感谢。

Answer 1

你的问题是那个

  imgTemp.src = groupMarkerUrl; //url to the actual image

需要一些时间才能完成。由于您使用imgTemp.width和imgTemp.height而不等待加载图像，因此这些值可能为零。 API会将您的图标绘制为零大小。

在MSIE以外的浏览器中，您可以省略icon.iconSize（并且不会复制mopoke所提及的G_DEFAULT_ICON中的详细信息），如果图像在标记显示时到达，则标记将默认为图像大小。在MSIE中，对于PNG图像，API使用AplphaImageLoader，如果未指定大小，则默认大小为零。

workround是通过将此代码内联放置来正确预加载图像，以便在onload事件之前执行

var imgTemp = new Image();
imgTemp.name = "img_" + i.toString();
imgTemp.src = groupMarkerUrl; //url to the actual image

将您的图标创建代码放在onload函数中，以便在完全获取内联代码加载的所有图像之后才会执行它。

Answer 2

不确定为什么在构造函数中使用G_DEFAULT_ICON。

要制作自定义图标，请使用以下内容：

var icon = new GIcon();
icon.image = groupMarkerUrl;
//...

重置服务器并尝试加载groupMarkerUrl中引用的图像后，您是否正确看到它？

Google地图标记未在首页加载时显示，但在刷新时显示

2 个答案: