我正在使用谷歌地图javascript应用程序,我想为其中一个标记使用自定义图像。
这是我认为我用来获取标记的代码示例。
var searchUrl = 'phpsqlsearch_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
GDownloadUrl(searchUrl, function(data) {
var xml = GXml.parse(data);
markers = xml.documentElement.getElementsByTagName('marker');
var sidebar2 = document.getElementById('sidebar2');
sidebar2.innerHTML = '';
if (markers.length == 0) {
document.getElementById('alert_div').innerHTML = "<a>No Results found</a>";
document.getElementById('alert_div').style.display = 'block';
map.setCenter(new GLatLng(40.178873,2.8125), 2);
return;
}
showSidebar();
var limitsearch = document.getElementById('limitsearch').value;
var bounds = new GLatLngBounds();
if (limitsearch <= markers.length){
for (var i = 0; i < limitsearch; i++) {
var name = markers[i].getAttribute('name');
var phone = markers[i].getAttribute('phone');
if (phone == 0){phone = '';}
var address = markers[i].getAttribute('address');
var distance = parseFloat(markers[i].getAttribute('distance'));
var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
parseFloat(markers[i].getAttribute('lng')));
var marker = createMarker(point, name, address);
map.addOverlay(marker);
var sidebarEntry = createSidebarEntry(marker, phone, name, address, distance);
sidebar2.appendChild(sidebarEntry);
bounds.extend(point);
}}
else{
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute('name');
var phone = markers[i].getAttribute('phone');
if (phone == 0){phone = '';}
var address = markers[i].getAttribute('address');
var distance = parseFloat(markers[i].getAttribute('distance'));
var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
parseFloat(markers[i].getAttribute('lng')));
var marker = createMarker(point, name, address);
map.addOverlay(marker);
var sidebarEntry = createSidebarEntry(marker, phone, name, address, distance);
sidebar2.appendChild(sidebarEntry);
bounds.extend(point);
}
}
map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
showSidebar();
getAlert();
});
}
答案 0 :(得分:1)
以下是createMarker
的替代品以支持图标
function createMarker(point, name, address, markerIcon) {
var markerOptions = {}
if (markerIcon !== undefined) {
markerOptions = { icon: markerIcon };
}
marker = new GMarker(point, markerOptions);
var html = '<b>' + name + '</b> <br/>' + address;
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});
return marker;
}
如果需要,您可以传入GIcon对象作为最后一个选项。你需要像这样初始化它:
var myIcon = new GIcon();
myIcon.iconSize = new GSize(16, 16);
myIcon.iconAnchor = new GPoint(4, 7);
myIcon.image = "http://www.url.com/somepic.png";
var marker = createMarker(point, name, address, myIcon);
您需要决定大小和锚点位置
另请参阅Google文档中的这些资源: