Search code examples
javascriptgoogle-maps-api-3app-inventor

Using a for loop to push coordinates to Google Maps API


I am trying to use a for loop to run through an array of coordinates and add a marker on the map at each set. This is what I have. This is running in app inventor so debugging is limited.

  function addFavorites() {
        var element = window.AppInventor.getWebViewString();
        if (element.indexOf("initFavCoords") > -1)
        {
            var redMarkers = [];
            var str = element.slice(14);
            redMarkers = str.split(',');
            popUp(redMarkers + "testing"); //coordinates are store correctly at this point
            for(var i = 0; i < redMarkers.length; i++)
            {
                var lattitude = redMarkers[i].slice(0, (element.indexOf(";")));
                var longitude = redMarkers[i].slice(element.indexOf(";")+1);

                marker = new google.maps.Marker({
                    position: (new google.maps.LatLng(lattitude, longitude)),
                    map: map,
                    icon: "./redMarker.png"
                });
            }
            window.AppInventor.setWebViewString("initDone");
        }



  }

popUp() does not affect this function

./redMarker.png is working

I also have the map initialized in a different function that is called before this one is. When this is run, the map displays but there are no markers. I am new to Google API, so it may be a simple mistake.

NOTE: coordinates are stored in this way [x1;y1,x2;y2]


Solution

  • var lattitude = redMarkers[i].slice(0, (element.indexOf(";")));
    var longitude = redMarkers[i].slice(element.indexOf(";")+1);
    

    These two lines need element changed to redMarkers[i], so they look like:

    var lattitude = redMarkers[i].slice(0, (redMarkers[i].indexOf(";")));
    var longitude = redMarkers[i].slice(redMarkers[i].indexOf(";")+1);