こんにちは、Google マップ API と JavaScript を初めて使用します。Google Chrome js コンソールで「Uncaught SyntaxError: Unexpected identifier」というメッセージが表示されます。downloadxml.js は geocodezip.com/scripts/downloadxml.js からのもので、私の xml ファイルの例は次のとおりです。
<marker lat="37.887793" long="32.500402" name="Necmeddin Erbakan Üniversitesi Rektörlüğü" cat="Üniversite" desc="<a href="http://www.konya.edu.tr"target="_blank">Necmeddin Erbakan Üniversitesi</a><br><img src="resimler/konyau.jpg" width="150" height="100" >" ico_wsize="20" ico_hsize="20" ico_wssize="20" ico_hssize="20" ico_icon="icons/university.png"/>
HTML;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<title>KONYA</title>
<script type="text/javascript" src="downloadxml.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?&sensor=false"></script>
<script type="text/javascript">
var map = null;
function createMarker(point, names, html) {
var contentString = html;
var marker = new google.maps.Marker({
position: point,
map: map,
zIndex: Math.round(latlng.lat()*-100000)<<5
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(contentString);
infowindow.open(map,marker);
});
}
function yukle()
{
var mapOptions =
{
center:new google.maps.LatLng(37.95, 32.505),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map= new google.maps.Map(document.getElementById("map-canvas"),mapOptions);
google.maps.event.addListener(map, 'click', function() {
infowindow.close();
});
downloadUrl("konya1.xml", function(doc) {
var xmlDoc = xmlParse(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[i] = google.maps.LatLng(lat,lng);
var names[i] = markers[i].getAttribute("name");
var cat[i] = markers[i].getAttribute("cat");
var desc[i] = markers[i].getAttribute("desc");
var ico_wsize = markers[i].getAttribute("ico_wsize");
var ico_hsize = markers[i].getAttribute("ico_hsize");
var ico_wssize = markers[i].getAttribute("wssize");
var ico_hssize = markers[i].getAttribute("hssize");
var ico_icon = markers[i].getAttribute("ico_icon");
var marker = createMarker(point[i],names[i],cat[i]);
}
});
}
var infowindow = new google.maps.InfoWindow(
{
size: new google.maps.Size(150,50)
});
google.maps.event.addDomListener(window, 'load', yukle);
//ico_wsize="20" ico_hsize="20" ico_wssize="20" ico_hssize="20" ico_icon="icons/supermarket.png"/>
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>