迭代响应数据以创建谷歌地图对象

时间:2017-02-09 02:04:32

标签: javascript jquery arrays json google-maps

我有这样的数据:

 "meta":{"About thisdata"}, "objects": [{"beat": "1614", "block": "081XX W HIGGINS RD", "case_number": "JA100466", "classification": "/api/1.0-beta3/crimeclassification/83/", "community_area": "/api/1.0-beta3/communityarea/10/", "community_name": "Norwood Park", "community_number": 10, "community_slug": "norwood-park", "crime_date": "2016-12-30T18:00:00", "description": "$500 AND UNDER", "domestic": false, "fbi_code": "06", "id": "10801504", "iucr": "0820", "latitude": 41.985421498, "location_description": "STREET", "longitude": -87.829756604, "primary_type": "THEFT", "ward": 41, "year": 2016},

总共这将在“对象”下有500个对象

我正在尝试创建其中的500个:new google.maps.LatLng(37.782551, -122.445368)

放入这样的数组:

function getPoints() {
        return [
          new google.maps.LatLng(37.782551, -122.445368),
          new google.maps.LatLng(37.782745, -122.444586),
          new google.maps.LatLng(37.782842, -122.443688)

         ]
}

将在此处返回:

function initMap () {
  map = new google.maps.Map(document.getElementById("map"), {
    center: { lat: 41.881, lng: -87.629 },
    zoom: 12,
    mapTypeId: 'satellite'
  });

  heatmap = new google.maps.visualization.HeatmapLayer({
    data: makeMarkers(), <-- Here
    map: map
  });
}

我尝试的代码如下所示:

var makeMarkers = function () {
  var result = [];
  var lat, lng = [];
  resp.objects.forEach(function(objects) { 
  lat.objects.latitude;
  lng = objects.longitude;
  return [new google.maps.LatLng(lat, lng)]
})
}

但它没有返回一个新对象数组,而是返回500个带有一个google对象的新数组,因为它位于forEach中。我不确定如何得到我正在寻找的东西。我在范围和数据迭代方面付出了相当大的努力。

谢谢!

1 个答案:

答案 0 :(得分:1)

我假设resp对象是帖子顶部的对象。首先,您需要在数组上使用map来实际获取数组。

地图

Map类似于forEach,因为它作用于数组中的每个元素。不同之处在于,在map的回调中,您将返回更新的元素。

例如:

[1, 2, 3, 4].map(function (element) {
  return element * 2
}

上面的返回数组如下:[2, 4, 6, 8]。 请注意回调方法中的返回值。

对于您的情况

您希望从objectsresp每个元素中获取map数组到Google地图对象(即google.maps.LatLng(lat, lng)

如果我理解你正在尝试做什么,以下内容应该有效。我建议使用更简单的map示例(filterforEachreducefoldr在某些语言中)很有用)。

var makeMarkers = function () {
  var result = [];
  var lat, lng = [];
  return resp.objects.map(function(element) {
    lat = element.latitude;
    lng = element.longitude;
    return new google.maps.LatLng(lat, lng);
  })
}