0

I need help accessing data in firebase firestore snapshot, I need latitude and longitude. I have both fields in database as well as Geopoint. I can see the data in console.log, but I can't access individual values. So far I tried different ways, here, with doc.latitude or doc.longitude I don't get errors but can't retrieve the data neither.

function initialize() {
    var latlng = new google.maps.LatLng(18.465733327729314, -69.93029399778331);
    var myOptions = {disableDefaultUI: true, zoom: 9, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP };
    var map = new google.maps.Map(document.getElementById("map"), myOptions);

    db = firebase.firestore();

    db.collection("GranSantoDomingo").get().then((querySnapshot) => {

    querySnapshot.forEach((doc) => {
        console.log(doc.id, "=>", doc.data());

        var marker = new google.maps.Marker({
                position: {lat: parseFloat(doc.latitude), lng: parseFloat(doc.longitude)},
                map: map,
            });
    }
    
    );
});

}

The system doesn't let me post an image, but the data structure is like this:

{
     "location":"Geopoint(18.7611489,-69.0386113)",
     "sector":"EL SEIBO I  ",
     "calle":"Av. MANUELA DIEZ ( EN LA GERENCIA)",
     "latitude":"18.7611489",
     "longitude":"-69.0386113"
  }
geocodezip
  • 158,664
  • 13
  • 220
  • 245
SenTnel
  • 31
  • 7
  • My guess is that you're trying to access `marker` outside of the callback where it is defined and populated. Data from the database can only be used in code *inside* the callback, or that is called from there. See https://stackoverflow.com/questions/64654873/wait-for-for-loop-to-finish-before-executing-next-function/64654982#64654982, https://stackoverflow.com/questions/52488087/how-to-get-data-from-firestore-db-in-outside-of-onsnapshot/52488328#52488328 and more from https://stackoverflow.com/search?tab=votes&q=%5bgoogle-cloud-firestore%5d%5bjavascript%5d%20asynchronous – Frank van Puffelen Mar 18 '21 at 01:23

1 Answers1

1

Got it! Proper way to get the elements:

    function initialize() {
    var latlng = new google.maps.LatLng(18.465733327729314, -69.93029399778331);
    var myOptions = {disableDefaultUI: true, zoom: 9, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, zoomControlsEnabled: true,
                    LocationEnabled: true,
                    LocationButtonEnabled: true, };
    var map = new google.maps.Map(document.getElementById("map"), myOptions);

    db = firebase.firestore();

    db.collection("GranSantoDomingo").get().then((querySnapshot) => {

    for (i = 0; i < querySnapshot.docs.length; i++) {        
        var Latitude = (querySnapshot.docs[i].data().latitude);
        var Longitude = (querySnapshot.docs[i].data().longitude);

        var marker = new google.maps.Marker({
                position: {lat: parseFloat(Latitude), lng: parseFloat(Longitude)},
                map: map,
                
            });   
    }
});

}
SenTnel
  • 31
  • 7