Consegui.. mas no IE... no chrome não mostra as coordenadas... ALGUEM poderia me ajudar?
<!DOCTYPE html>
<html>
<head>
<title>XML example w/ info window fix</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body {background: url(./img/mapa1.jpeg) repeat;margin: 0px; padding: 0px }
#map_canvas { height: 100% }
.tabela {background-color: #32ACFD;color: #FFFFFF;aling: center; font-family: arial, helvetica, serif;font-size: 14px;text-align:center;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="./js/downloadxml.js"></script>
<script type="text/javascript">
var infoWindow = new google.maps.InfoWindow();
function createMarker(point,info,map) {
var iconURL = 'cone.png'; var iconSize = new google.maps.Size(20,34);
var iconOrigin = new google.maps.Point(0,0); var iconAnchor = new google.maps.Point(10,34);
var myIcon = new google.maps.MarkerImage(iconURL, iconSize, iconOrigin, iconAnchor);
var shadowURL = 'cone_shadow.png'; var shadowSize = new google.maps.Size(35, 34);
var shadowOrigin = new google.maps.Point(0, 0); var shadowAnchor = new google.maps.Point(10, 33);
var myShadow = new google.maps.MarkerImage(shadowURL, shadowSize, shadowOrigin, shadowAnchor);
var iconShape = [8,33, 4,15, 1,15, 0,12, 0,5, 6,0, 12,0, 19,14, 15,15, 10,33];
var myMarkerShape = {
coord: iconShape,
type: 'poly'
};
var myMarkerOpts = {
position: point,
map: map,
<!-- icon: myIcon,-->
<!-- shadow: myShadow, -->
shape: myMarkerShape
};
var marker = new google.maps.Marker(myMarkerOpts);
google.maps.event.addListener(marker, 'click', function() {
infoWindow.close();
infoWindow.setContent(info);
infoWindow.open(map,marker);
});
}
function initialize() {
var latlng = new google.maps.LatLng(-23.521182,-46.63559);
var mapOpts = {
zoom: 9,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
mapOpts);
downloadUrl("data.xml", function(data) {
var xmlDoc = xmlParse(data);
var records = xmlDoc.getElementsByTagName("marker");
var side_html = "";
for (var i = 0; i < records.length; i++) {
var rec = records[i];
var name = rec.getAttribute("descr");
var lat = parseFloat(rec.getAttribute("lat"));
var lng = parseFloat(rec.getAttribute("lng"));
var pt = new google.maps.LatLng(lat, lng);
var html = "<strong>" + name + "</strong><br />";
createMarker(pt,html,map);
}
});
}
</script>
</head>
<body onload="initialize()">
<center>
<br>
<table border="2" cellspacing="0" cellpadding="5">
<tr class="tabela">
<td style="border-color: white" style="border-style:groove"><strong>Coordenadas do Relatório</strong></td>
</tr>
<tr>
<td style="border-color: white" style="border-style:groove"><div id="map_canvas" style="width: 1000px; height: 500px"></div> </td>
</tr>
</table>
</center>
</body>
</html>
JS :
/**
* Returns an XMLHttp instance to use for asynchronous
* downloading. This method will never throw an exception, but will
* return NULL if the browser does not support XmlHttp for any reason.
* @return {XMLHttpRequest|Null}
*
* Original author: Mike Williams
* Downloaded from www.geocodezip.com/scripts/downloadxml.js on 10/13/10
*/
function createXmlHttpRequest() {
try {
if (typeof ActiveXObject != 'undefined') {
return new ActiveXObject('Microsoft.XMLHTTP');
} else if (window["XMLHttpRequest"]) {
return new XMLHttpRequest();
}
} catch (e) {
changeStatus(e);
}
return null;
};
/**
* This functions wraps XMLHttpRequest open/send function.
* It lets you specify a URL and will call the callback if
* it gets a status code of 200.
* @param {String} url The URL to retrieve
* @param {Function} callback The function to call once retrieved.
*/
function downloadUrl(url, callback) {
var status = -1;
var request = createXmlHttpRequest();
if (!request) {
return false;
}
request.onreadystatechange = function() {
if (request.readyState == 4) {
try {
status = request.status;
} catch (e) {
// Usually indicates request timed out in FF.
}
if ((status == 200) || (status == 0)) {
callback(request.responseText, request.status);
request.onreadystatechange = function() {};
}
}
}
request.open('GET', url, true);
try {
request.send(null);
} catch (e) {
changeStatus(e);
}
};
/**
* Parses the given XML string and returns the parsed document in a
* DOM data structure. This function will return an empty DOM node if
* XML parsing is not supported in this browser.
* @param {string} str XML string.
* @return {Element|Document} DOM.
*/
function xmlParse(str) {
if (typeof ActiveXObject != 'undefined' && typeof GetObject != 'undefined') {
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.loadXML(str);
return doc;
}
if (typeof DOMParser != 'undefined') {
return (new DOMParser()).parseFromString(str, 'text/xml');
}
return createElement('div', null);
}
/**
* Appends a JavaScript file to the page.
* @param {string} url
*/
function downloadScript(url) {
var script = document.createElement('script');
script.src = url;
document.body.appendChild(script);
}
