【问题标题】:Google Maps API Javascript. Cannot load the InfoWindow谷歌地图 API Javascript。无法加载信息窗口
【发布时间】:2014-09-28 02:21:31
【问题描述】:

我一直在尝试在标记上加载 InfoWindow,但无法加载。我正在尝试在用户单击标记后加载 InfoWindow。问题是因为我没有在 intialize() 中定义 eventListener 吗?我试过这样做,但还是不行!谁能帮助

javascript代码是:

var zwsid = "*My_API_Key*"; 
var request = new XMLHttpRequest();
var mapObj;
var map_Estate;
function initialize() 
{
  geocoder = new google.maps.Geocoder();
  var defaultLoc = new google.maps.LatLng(51.5286416, -0.1015987); //defines location of the Map
  map_Estate =        // defines the properties of the map
  {  center: defaultLoc,
     zoom:16,
     mapTypeId: google.maps.MapTypeId.ROADMAP  }
  mapObj = new google.maps.Map( document.getElementById('mapArea'), map_Estate);  //creates a object to load in HTML file
}

function xml_to_string ( xml_node ) 
{
  var value1, marker;
    //document.getElementById("test1").innerHTML = "Entered addrMap";
    var address = document.getElementById('address').value;

    geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) 
    {
      document.getElementById("test1").innerHTML = " LATLNG is: "+ results[0].geometry.location+ " STATUS: " + status;
             mapObj.setCenter(results[0].geometry.location);
             marker = new google.maps.Marker({
                                                map: mapObj,
                                                position: results[0].geometry.location  });                 
    }  
    else 
    {   alert('Geocode was not successful for the following reason: ' + status);  }
    });    
       google.maps.event.addListener(marker, 'click', function()
    {
        var infoProp = new google.maps.InfoWindow({ content: "Value of the property is "});
        infoProp.open(mapObj, marker);
} );           

if (xml_node.xml)
value1 = xml_node.xml;
var xml_serializer = new XMLSerializer();
value1 =  xml_serializer.serializeToString(xml_node);  
document.getElementById("text1").innerHTML += "City: "+document.getElementById("city").value +
                                                 ",  State: "+document.getElementById("state").value+ ", Cost: "+value1+"<br></br>";
}

function displayResult () 
{
    if (request.readyState == 4) 
    {
    var xml = request.responseXML.documentElement;
    var value = xml.getElementsByTagName("zestimate")[0].getElementsByTagName("amount")[0];        
    //document.getElementById("output").innerHTML = xml_to_string(value);
    xml_to_string(value);
}
}

function sendRequest () {
request.onreadystatechange = displayResult;
var address = document.getElementById("address").value;
var city = document.getElementById("city").value;
var state = document.getElementById("state").value;
var zipcode = document.getElementById("zipcode").value;
request.open("GET","proxy.php?zws-id="+zwsid+"&address="+address+"&citystatezip="+city+"+"+state+"+"+zipcode);
request.withCredentials = "true";
request.send(null);
}

【问题讨论】:

  • 添加一个简单的jsfiddle,方便我们为您提供帮助。
  • 请用你的 html 和 xmlfile 更新这个小提琴。谢谢。 jsfiddle.net/iambnz/mmy15svu
  • @bnz 我已经用 HTML 更新了 jsfiddle 文件。基本上,我想要实现的是通过使用 Zillow API,我试图提取房产的价格。因此,xml 文件与 API 相关联。
  • 请分享更新小提琴的网址

标签: javascript google-maps-api-3 infowindow


【解决方案1】:

当您在 if 语句中移动侦听器时,它将起作用。

除此之外,我建议您清理和构建您的代码。

IF 语句 (JS)

    if (status == google.maps.GeocoderStatus.OK) 
    {
      document.getElementById("test1").innerHTML = " LATLNG is: "+ results[0].geometry.location+ " STATUS: " + status;
             mapObj.setCenter(results[0].geometry.location);
             marker = new google.maps.Marker({
                                                map: mapObj,
                                                position: results[0].geometry.location  });

google.maps.event.addListener(marker, 'click', function()
    {
        var infoProp = new google.maps.InfoWindow({ content: "Value of the property is "});
        infoProp.open(mapObj, marker);
} );         
    } 

在这里工作:http://jsfiddle.net/iambnz/z1dx45rL/

【讨论】:

  • 你能告诉我这是什么意思吗:function xml_to_string( xml_node){ var value1; if(xml_node.xml) value1=xml_node.xml; var xml_serializer = new XMLSerializer(); value1 = xml_serializeToString(xml_node);
  • 一些值来自 xml 文件。不知道这些是标记 - 还是您的其他 api (zillow)。你能分享这些 xml 文件之一吗?
  • 我没有 xml 文件。我只有 API 密钥!
猜你喜欢
  • 2016-07-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-08-25
  • 1970-01-01
  • 2013-02-11
  • 2013-12-16
相关资源
最近更新 更多