Показать все геоданные parse.com на картах google

Question

Я пытаюсь взять все геоинтеграции из класса на parse.com и показать их как маркеры на карте google. (Только о 1 geoipoin, широчайшие LNG, работает как шарм, так вот код)

function businessProfile(uid) { 
     Parse.initialize("APPID", "JSKEY"); 
     var bprofile = Parse.Object.extend("magazia"); 
     var query = new Parse.Query(bprofile); 
     query.notEqualTo("objectId", null); 
     query.find({ 
      success: function(results) { 
      for (var i = 0; i < results.length; i++) { var object = results[i]; 
        var locationsBlock = {}; 
        locationsBlock = JSON.parse(JSON.stringify(object)); 
        var location = {}; 
        location = JSON.parse(JSON.stringify(locationsBlock.latlon)); 
        var lat = location.latitude; 
        var lon = location.longitude; 
        var magname = object.get('name'); 
        setData(magname, lat, lon); 
       } 


      }, 
     error: function(error) { 

       alert("Error: " + error.code + " " + error.message); 
      } 
     }); 
    } 

Так с кодом выше я получаю все geopoints из 16 различных строк и я подталкивать их в массив (я надеюсь, что я делаю это правильно), какой массив объявлен вне функции, потому что я вызываю его снова на функцию инициализации карты ниже.

function initMap() { 

    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 3, 
    center: {lat: 34.9, lng: 111.2} 
    }); 

    setMarkers(map); 
} 
function setData(magname, lat, lon){ 
    var arlat = []; 
arlat.push(magname, lat, lon); 
console.log(arlat); 
} 
function setMarkers(map) { 

    for (var i = 0; i < arlat.length; i++) { 
    var arlat = arlat[i]; 
    var marker = new google.maps.Marker({ 
     position: {lat: arlat[1], lng: arlat[2]}, 
     map: map, 
     title: arlat[0] 

    }); 
    } 
} 

Итак, теперь я зациклен на том, как разместить каждый геосайт на карте с помощью маркеров. Я знаю, что это связано с циклом «за цикл», но я застрял там. Теперь он показывает только первый в списке маркер, и я хочу показать им все.

UPDATE

Так один обновление моего кода я уже успел пройти все имена и Lat Lon, что я получаю от моего класса в разборе и теперь я положил их в function setData()

Теперь вопрос в том, как я могу передать массив arlat в setMarkers(), так как функция setMarkers принимает переменную map из initMap(), и я хочу, чтобы она также взяла массив arlat из функции setData(), поэтому я могу напечатать в правой части lat lon и имя? Вот предварительный просмотр console.log(arlat)

Answer 1

Вместо нажатия трех переменных:

arlat.push(magname, lat, lon); 

Вы, вероятно, должны push объект, например:

arlat.push({lat: lat, lon: lon}); 

Тогда мы просто нужно для итерации по выводам (вы можете сделать это с помощью цикла for, но forEach может быть проще, потому что y НУ не индексировать в массив, просто использовать функцию обратного вызова, которая принимает элемент массива) ...

var marker = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    icon: iconBase + 'marker.png', 

    title: 'Hello World!' 
}); 
arlat.forEach(function(positionObject) { 
    var pin = new google.maps.Marker({ 
     position: { 
      lat: positionObject.lat, 
      lon: positionObject.lon 
     }, 
     map: map, 
     //title: positionObject.title, //if title property is set above 
     icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|00ff00' //green pin, more available 
    }); 
}); 

ли эту работу для вас? Для получения дополнительной информации о иконах, Извлечь google maps API (который вы, вероятно, уже смотрели на)

UPDATE - на основе вашего обновления, я заметил, вы переназначение значения arlat, которое конфликтует с итерациями Foreach. Я изменил его, чтобы использовать объекты, а не перезаписывать объект массива - см. this plunkr или фрагмент кода ниже.

function initialize() { 
 
    var arlat = []; 
 
    setData('a', 34.0, 111.2); 
 
    setData('v', 30.1, 116.3); 
 
    initMap(); 
 

 
    function initMap() { 
 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
     zoom: 3, 
 
     center: { 
 
     lat: 34.9, 
 
     lng: 111.2 
 
     } 
 
    }); 
 
    setMarkers(map); 
 
    } 
 

 
    function setData(magname, lat, lon) { 
 
    //notice how we name the properties below: name, lat, lon - these are referenced down below in setMarkers() 
 
    arlat.push({ 
 
     name: magname, 
 
     lat: lat, 
 
     lon: lon 
 
    }); 
 
    } 
 

 
    function setMarkers(map) { 
 
    for (var i = 0; i < arlat.length; i++) { 
 
     var marker = new google.maps.Marker({ 
 
     position: { 
 
      lat: arlat[i].lat, 
 
      lng: arlat[i].lon 
 
     }, 
 
     map: map, 
 
     title: arlat[i].name 
 
     }); 
 
    } 
 
    } 
 
} 
 
google.maps.event.addDomListener(window, 'load', initialize);

html, 
 
body, 
 
#map { 
 
    height: 90%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 
 
<div id="map"></div>