简体   繁体   English

动态将标记添加到Google地图

[英]Dynamically adding markers to Google maps

I am trying to add markers to my Google map dynamically using a combination of ajax and php. 我正在尝试使用ajax和php的组合向我的Google地图动态添加标记。 The first part of the code sends the latlng to the php file. 代码的第一部分将latlng发送到php文件。 The php file then returns the marker location needed. 然后,php文件返回所需的标记位置。

When I alert the return part (ALERT TEST TO ENSURE PHP PROCESSED DATA CORRECTLY), it looks OK, but I cant seem to add the markers from the return on to my map. 当我提醒返回部分(通过ALERT测试以正确确保PHP处理的数据)时,它看起来还可以,但我似乎无法将返回中的标记添加到我的地图上。

See code below. 请参见下面的代码。
//SEND DATA TO URL (send to php file) //RETURN DATA FOR PLACE MARKERS (this is what the return php file produces) //将数据发送到URL(发送到php文件)//返回用于位置标记的数据(这是php文件的返回结果)

Many thanks, 非常感谢,

//SEND DATA TO URL //将数据发送到URL

     var xmlHttp = getXMLHttp();
     xmlHttp.onreadystatechange = function() {
     if (xmlHttp.readyState == 4) {
     HandleResponse(xmlHttp.responseText);
     }}                     
     xmlHttp.open("POST",'MYPHPFILE',true);
     xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
     xmlHttp.send("LATLON="+strLAT);

//RETURN DATA FOR PLACE MARKERS //返回位置标记的数据

     var wxlatlng = new google.maps.LatLng(52,1); 
     var marker = new google.maps.Marker({ 
     position: wxlatlng,
     map: map,
     icon: '../../icons/flags/traffic_light_red.png',
     title: 'TEST', });

//RETURN DATA FOR PLACE MARKERS //返回位置标记的数据

     var wxlatlng = new google.maps.LatLng(52,1.1); 
     var marker = new google.maps.Marker({ 
     position: wxlatlng,
     map: map,
     icon: '../../icons/flags/traffic_light_red.png',
     title: 'TEST', });

//ALERT TEST TO ENSURE PHP PROCESSED DATA CORRECTLY //进行测试以确保PHP正确处理数据

     function HandleResponse(response) {
            document.getElementById('ResponseDiv').innerHTML = response;
            alert($('#ResponseDiv').text());
        }                           

The answer i found for my question was to use the php file to create the markers xml file and load the xml file via jQuery response 我为我的问题找到的答案是使用php文件创建标记xml文件并通过jQuery响应加载xml文件

See code below; 参见下面的代码;

 jQuery.get(YOURXMLFILE, function(data) {
       jQuery(data).find("marker").each(function() {
       var eachMarker = jQuery(this);
       var markerCoords = new google.maps.LatLng(
       parseFloat(eachMarker.find("Lat").text()),
       parseFloat(eachMarker.find("Lng").text())
       );
       var header  = eachMarker.find("title").text();
       var content = eachMarker.find("Content").text();
       var wxicon  = eachMarker.find("icon").text();
       //--------------------------------------------------------------------------        
        marker = new google.maps.Marker({
        position: markerCoords,
        icon: wxicon,
        map: map,
        animation: google.maps.Animation.DROP,
        title: header,
        });
        });
        }); 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM