Instagram pictures to Google Maps in a radius of 1km around you

Question

I'm wondering if it's possible to get Instagram photo's to Google Maps working with API's. So far I got Google Maps working and it's showing my current location, along with a radius of 1km around me.

The thing I want to do is show a certain amount of Instagram pictures in that radius around me, taken by everybody.

But so far, I got no idea where or how to start, and if it's even possible.

The code for my google maps is:

    </script>
        <script type="text/javascript">
        var map;
        var service;
        var marker;
        var pos;
        var infowindow;

        function initialize() {

            var mapOptions = {
                zoom: 14
            };

            map =   new google.maps.Map(document.getElementById('map-canvas'),
                    mapOptions);

            //HTML5 geolocation
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(function (position) {
                    pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);


                    infowindow = new google.maps.InfoWindow({
                        map: map,
                        position: pos,
                        content: 'This is your current position!'
                    });

                        var circle = new google.maps.Circle({
                            map: map,
                            position: pos,
                            radius: 1000,    // 1km in metres
                            fillColor: '#6D86D1'
                        });
                        circle.bindTo('center', infowindow, 'position');

                    map.setCenter(pos);

                    infowindow = new google.maps.InfoWindow();
                    var service = new google.maps.places.PlacesService(map);
                    service.nearbySearch(request, callback);

                },

                    function () {
                        handleNoGeolocation(true);
                    });
            } else {
                handleNoGeolocation(false);
            }

            function callback(results, status) {
                if (status == google.maps.places.PlacesServiceStatus.OK) {
                    for (var i = 0; i < results.length; i++) {
                        createMarker(results[i]);
                    }
                }
            }

            function createMarker(place) {
                var placeLoc = place.geometry.location;
                var marker = new google.maps.Marker({
                    map: map,
                    position: place.geometry.location
                });

                google.maps.event.addListener(marker, 'click', function () {
                    infowindow.setContent(place.name);
                    infowindow.open(map, this);
                });

            }
        }
        google.maps.event.addDomListener(window, 'load', initialize);


    </script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>

Answer 1

You have to use the media/search API to get photos around a location ( lat/lng ) and distance :

https://api.instagram.com/v1/media/search?lat=48.858844&lng=2.294351&distance=1000&access_token=ACCESS-TOKEN

Here is an implementation of getting instagram photos around any radius on google maps: http://www.gramfeed.com/instagram/map

Instagram pictures to Google Maps in a radius of 1km around you

Question

1 answers

solution1
1 2014-03-16 20:58:15

Instagram pictures to Google Maps in a radius of 1km around you

Question

1 answers

solution1 1 2014-03-16 20:58:15

solution1
1 2014-03-16 20:58:15