我已经以格式(示例)
生成了XML(alarms.xml)<markers>
<marker lat="41.932797" lng="21.483765" alarm="Boston" severity="0" />
<marker lat="41.732797" lng="21.183765" alarm="Toronto" severity="2" />
</markers>
根据严重程度,需要显示默认标记的不同颜色:
0-green
1-violet
2-ocher
等
我在这个简单的html文件中需要更改什么?
感谢您的帮助
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Google Maps</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false&" type="text/javascript"></script>
</head>
<body onunload="GUnload()">
<table border=1>
<tr>
<td>
<div id="map" style="width: 1550px; height: 1450px"></div>
</td>
</tr>
</table>
<script type="text/javascript">
//<![CDATA[
if (GBrowserIsCompatible()) {
var gmarkers = [];
function createMarker(point,name,alarm) {
var marker = new GMarker(point);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(alarm);
});
return marker;
}
function myclick(i) {
GEvent.trigger(gmarkers[i], "click");
}
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng( 41.932797,21.483765), 10);
GDownloadUrl("alarms.xml", function(doc) {
var xmlDoc = GXml.parse(doc);
var markers = xmlDoc.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
// obtain the attribues of each marker
var lat = parseFloat(markers[i].getAttribute("lat"));
var lng = parseFloat(markers[i].getAttribute("lng"));
var point = new GLatLng(lat,lng);
var alarm = markers[i].getAttribute("alarm");
var label = markers[i].getAttribute("label");
// create the marker
var marker = createMarker(point,label,alarm);
map.addOverlay(marker);
}
});
}
//]]>
</script>
</body>
</html>
答案 0 :(得分:1)
在添加标记之前,请按严重性级别设置自定义图标:
var severity = parseInt(markers[i].getAttribute("severity"));
var severityIcon = new GIcon(G_DEFAULT_ICON);
var color;
if (severity == 1) color = "red";
else if (severity == 2) color = "blue";
else if (severity == 3) color = "green";
else color = "yellow";
severityIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/micons/" + color + "-dot.png";
markerOptions = { icon:severityIcon };
然后将其添加到地图中:
map.addOverlay(new GMarker(latlng, markerOptions));
这取自优秀的Google地图示例网站:https://google-developers.appspot.com/maps/documentation/javascript/v2/examples/icon-simple