1

我在地图上显示不同的标记，问题是有时（特别是当我重置网络服务器时）地图加载正确，它甚至显示点的阴影，但标记在地图上不显示/不可见。但是在随后的调用中，标记会正确显示（可能是 cached ，但不确定）。这种行为在所有浏览器中都是一致的，即 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);

谢谢。

4

2 回答 2

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，如果未指定大小，则默认大小为零。

解决方法是通过将此代码内联来正确预加载图像，以便在 onload 事件之前执行它

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

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

于 2010-01-04T05:33:31.650 回答
0

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

要执行自定义图标，请使用以下内容：

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

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

于 2010-01-04T04:37:17.303 回答