2017-10-13 26 views
1

我有后端列表,我有2个地方。谷歌热图只显示一个地方

这是后端的代码。

public JsonResult GetData() 
    { 

     List<Park> stations = new List<Park>(); 

     stations.Add(new Park() 
     { 
      Id = 2, 
      GeoLat = 37.608644, 
      GeoLong = 55.75226, 
      Weight = 12 
     }); 

     stations.Add(new Park() 
     { 
      Id = 3, 
      GeoLat = 30.5807913, 
      GeoLong = 50.493239, 

      Weight = 12 
     }); 

     return Json(stations.ToArray(), JsonRequestBehavior.AllowGet); 
    } 

而且我得到它的客户端这样

function getPoints() { 

     $.getJSON('@Url.Action("GetData", "Home")', 
      function (data) { 
       var marker; 
       // Проходим по всем данным и устанавливаем для них маркеры 
       $.each(data, 
        function(i, item) { 
         marker = [ 
          { 
           'location': new google.maps.LatLng(item.GeoLong, item.GeoLat), 
           'map': map, 
           'weight': item.Weight 
          } 
         ]; 
        }); 



       var pointArray = new google.maps.MVCArray(marker); 
       console.log(pointArray); 
       heatmap = new google.maps.visualization.HeatmapLayer({ 
        data: pointArray 
       }); 
       heatmap.setMap(map); 


      }); 
    }; 

和更新地图在这个方法中

function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), 
      { 
       zoom: 13, 
       center: { lat: 55.752622, lng: 37.617567 }, 
       mapTypeId: 'satellite' 
      }); 
     getPoints(); 
    } 

但我只看到一个地方。我不明白为什么,因为我在这一行设置了断点

return Json(stations.ToArray(), JsonRequestBehavior.AllowGet); 

我返回2个地方。

哪里可以解决我的问题?

感谢对帮助

回答

0
var marker; 

应改为:

var marker = []; 

marker = [ 
    { 
     'location': new google.maps.LatLng(item.GeoLong, item.GeoLat), 
     'map': map, 
     'weight': item.Weight 
    } 
]; 

应改为:

marker.push({ 
    'location': new google.maps.LatLng(item.GeoLong, item.GeoLat), 
    'map': map, 
    'weight': item.Weight 
}); 

现有代码的问题在于,您是指定为单个元素数组(因此您只能有效地显示最后一个标记)。您目前不是添加到该阵列。我的更改使用push来解决此问题。

+0

是的。它有助于。谢谢 –