在Google地图的信息窗口中显示已解析的数据

时间:2017-10-25 16:50:20

标签: angularjs google-maps ionic-framework infowindow

我无法在Google Maps Ionic框架内的解析后的JSON文件中尝试显示对象数组中的事件名称。现在我有一个显示每个事件的标记,带有一个名为“testing”的简单字符串,显示正常。问题是我不确定如何在这个信息窗口中显示每个事件名称而不是我创建的字符串。任何帮助,将不胜感激。我将发布我现在拥有的示例图像以及下面的信息窗口功能。谢谢!

我现在展示的内容:

here

标记/信息窗口功能:

getMarkers(){
//this.http.get('assets/data/markers.json').map((res)=>res.json()).subscribe(data=>{
  this.http.get('http://app.toronto.ca/cc_sr_v1_app/data/edc_eventcal_APR?limit=500').map((res)=>res.json()).subscribe(data=>{
this.addMarkersMap(data);
});
}


addMarkersMap(markers){
for(let marker of markers)
{
 var loc = marker.calEvent.locations[0]['coords'];

  console.log(loc);


  marker = new google.maps.Marker({
   position: loc,
  map: this.map,

  });


  var infoWindow = new google.maps.InfoWindow({
   content: markers.eventName

}); 

google.maps.event.addListener(marker, 'click', function(str)
{ 
   return function() {
           infoWindow.setContent(str);
           infoWindow.open(this.map, marker);
                     }
}(markers.eventName));

}
}

1 个答案:

答案 0 :(得分:0)

我纠正自己。你可以从这里的封闭中受益。 使用自调用函数将参数密封到信息窗口:

google.maps.event.addListener(marker, 'click', function(str)
                   { 
                      return function() {
                              infoWindow.setContent(str);
                              infoWindow.open(this.map, marker);
                                        }
                   }(markers.calEvent.eventName));