Error "data is undefined " Trying to use GetJSON / Google Map

I'm trying to make markers in a google map from a bicycle position API in paris.I don't understand why I got a error:

data[I] undefined.

 $(function() {

     $.getJSON('https://api.jcdecaux.com/vls/v1/stations?contract=paris&apiKey=de4b32d53a372975a38df03d8f31b7edd9c9b793', function(data) {

         for (var i = 0; i <= data.length; i++) {
             console.log(data[i]);
             var lat = data[i].position.lat;
             var lng = data[i].position.lng;
             var position = {
                 lat: lat,
                 lng: lng
             };

             var marker = new google.maps.Marker({
                 position: position,
                 map: map,
             });
         };

     });
 });

     });
 });

Upvotes: 1

Views: 127

Answers (3)

Mohan Singh
Mohan Singh

Reputation: 1162

Try this code..!

  $(function() {

        $.getJSON('https://api.jcdecaux.com/vls/v1/stations?contract=paris&apiKey=de4b32d53a372975a38df03d8f31b7edd9c9b793', function(data) {
           //Modified code
            for (var i = 0; i < data.length; i++) {
                console.log(data[i]);
                var lat = data[i].position.lat;
                var lng = data[i].position.lng;
                var position = {
                    lat: lat,
                    lng: lng
                };


                var marker = new google.maps.Marker({
                   //Modified code
                    position: new google.maps.LatLng(position),
                    map: map,
                });

            };

        });
    });

Upvotes: 0

Razon Yang
Razon Yang

Reputation: 454

An array's index should be less than it's length, so the loop condition is wrong:

for (var i = 0; i <= data.length; i++) {}

Correct:

for (var i = 0; i < data.length; i++) {}

Upvotes: 1

4b0
4b0

Reputation: 22323

Couple of closing bracket is mismatch in your code.Run the below snippet and you get a data from api.

 $.getJSON('https://api.jcdecaux.com/vls/v1/stations?contract=paris&apiKey=de4b32d53a372975a38df03d8f31b7edd9c9b793', function(data) {

         for (var i = 0; i <= data.length; i++) {
             console.log(data[i]);
             var lat = data[i].position.lat;
             var lng = data[i].position.lng;
             var position = {
                 lat: lat,
                 lng: lng
             };

             var marker = new google.maps.Marker({
                 position: position,
                 map: map,
             });
         }


     });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Upvotes: 0

Related Questions