Google Maps API javascript v3 with jQuery
Hello everyone,
I am currently developing a web application that users geotag.
I use javascript google maps api and v3 with jquery.
here is my code:
-
|
1
2 3 4 5 6 7 8 9 10
|
$().ready(function() { var latlng = new google.maps.LatLng(49.41483, 2.817895); var options = { center: latlng, zoom: 6, mapTypeId: google.maps.MapTypeId.ROADMAP }; var carte = new google.maps.Map(document.getElementById("carte"), options); });
I then a javascript function that is called after clicking a button.
function afficher(id) { $.ajax({ url : "geo.php", dataType : "XML", data : "id="+id, success : function(data) { var i = 0; $(data).find('fire').each(function() { i = i+1; var fire = $(this); var longi = fire.attr("longitude"); var lati = fire.attr("latitude"); var ltlg = new google.maps.LatLng(lati, longi); var myMarker = new google.maps.Marker({ position: ltlg, map: carte, icon: fire.attr("icone"), title: fire.attr("address") }); }); if(i==0) alert("aucune geo trouvee"); //alert(i); }, error : function() { alert('error'); } }); }
|
function is called and returns the XML text I wanted but the markers are not displayedin the map:
is the message:
Element referenced by ID / NAME in the global context. Property Use W3C standarddocument.getElementById () "instead.
[an error Stopper] map: map
and when I replace card by document.getElementById ("map") in the function display ()the XML text is returned but the markers are not displayed and this time without an error message.
what should I do to ensure that markers are clearly posted??
Thank you for your help.