API tools faq
paste
pepoflex

Google Place API Geolocalizacion

pepoflex
Mar 11th, 2016
74
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 3.63 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8"/>
  5.         <title>Buscar Restaurantes Cercanos</title>
  6.         <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
  7.         <script src="https://maps.googleapis.com/maps/api/js?libraries=places" type="text/javascript"></script>
  8.  
  9.     </head>
  10.     <body>
  11.  
  12.         <div class="container">
  13.             <h1>Buscar Restaurantes Cercanos:</h1>
  14.             <div class="row">
  15.  
  16.                 <div id="map" style="height:500px"></div>
  17.  
  18.             </div>
  19.             <br>
  20.             <footer>
  21.                 <div align="center">
  22.                     <a href="https://twitter.com/pepoflex" target="_blank">Juan Castro Lurita, @pepoflex</a>
  23.                 </div>
  24.             </footer>
  25.         </div>
  26.  
  27.  
  28.         <script type="text/javascript">
  29.             var map;
  30.             var infowindow = new google.maps.InfoWindow();
  31.             var pos;
  32.  
  33.             function initMap() {
  34.  
  35.               if (navigator.geolocation) { //Geolocalizar
  36.                 navigator.geolocation.getCurrentPosition(function(position) {
  37.  
  38.                   pos = {
  39.                     lat: position.coords.latitude/*-12.0872261*/,
  40.                     lng: position.coords.longitude/*-77.0029128*/
  41.                   }
  42.                   map = new google.maps.Map(document.getElementById('map'), {
  43.                     center: myLocation,
  44.                     zoom: 17
  45.                   });
  46.  
  47.                   infoWindow = new google.maps.InfoWindow({
  48.                     map: map
  49.                   });
  50.  
  51.                   infoWindow.setPosition(pos);
  52.                   infoWindow.setContent('Mi ubicación.');
  53.                   map.setCenter(pos);
  54.                   var myLocation = pos;
  55.  
  56.                   var service = new google.maps.places.PlacesService(map);
  57.                   service.nearbySearch({
  58.                     location: myLocation,
  59.                     radius: 500,
  60.                     types: ['restaurant'/* ,'food','point_of_interest','establishment' */]
  61.                   }, callback);
  62.                 })
  63.               };
  64.             }
  65.  
  66.             function callback(results, status) {
  67.               if (status === google.maps.places.PlacesServiceStatus.OK) {
  68.                 for (var i = 0; i < results.length; i++) {
  69.                   createMarker(results[i]);
  70.                 }
  71.               }
  72.             }
  73.  
  74.             function createMarker(place) {
  75.             var placeLoc = place.geometry.location;
  76.                 if (place.icon) {
  77.                   var image = new google.maps.MarkerImage(
  78.                         place.icon, new google.maps.Size(71, 71),
  79.                         new google.maps.Point(0, 0), new google.maps.Point(17, 34),
  80.                         new google.maps.Size(25, 25));
  81.                 } else var image = null;
  82.  
  83.                 var marker = new google.maps.Marker({
  84.                   map: map,
  85.                   icon: image,
  86.                   position: place.geometry.location
  87.                 });
  88.  
  89.                 service = new google.maps.places.PlacesService(map);
  90.  
  91.                 var request =  {
  92.                   reference: place.reference
  93.                 };
  94.  
  95.                 google.maps.event.addListener(marker,'click',function(){
  96.                     service.getDetails(request, function(place, status) {
  97.                       if (status == google.maps.places.PlacesServiceStatus.OK) {
  98.                         var contentStr = '<h5><strong>'+place.name+'</strong></h5><p>'+place.formatted_address;
  99.                         if (!!place.formatted_phone_number) contentStr += '<br>'+place.formatted_phone_number;
  100.                         if (!!place.website) contentStr += '<br><a target="_blank" href="'+place.website+'">'+place.website+'</a>';
  101.                         /* contentStr += '<br>'+place.types+'</p>'; */
  102.                         contentStr += '<br>ID: '+place.place_id+'</p>';
  103.                         infowindow.setContent(contentStr);
  104.                         infowindow.open(map,marker);
  105.                       } else {
  106.                         var contentStr = "<h5>No Hubo Resultados, status="+status+"</h5>";
  107.                         infowindow.setContent(contentStr);
  108.                         infowindow.open(map,marker);
  109.                       }
  110.                     });
  111.                 });
  112.             }
  113.  
  114.             initMap();
  115.         </script>      
  116.            
  117.        
  118.  
  119.     </body>
  120. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!