Geolocation to nearby health services


#1

Hi,

I am wanting to include geolocation so that it will track where the user is and to provide them with nearby health services and give them directions of how to get there.

can this be done?

please help


#2

@jesst446

absolutely it can be done registered your app with google maps go to below link
https://console.developers.google.com/
create project and enable these api

google maps geolocation api
google maps javascript api
google place api webservices

after that in index.html add google map api

<script src="https://maps.googleapis.com/maps/api/js?key="Your_PROJECT_API_KEY"&libraries=places" async defer></script>

Add geolocation plugin for getting current location

var geocoder = new google.maps.Geocoder(); // use geocoder to convert user current location into adress

var options = {
            enableHighAccuracy: true
        };

navigator.geolocation.getCurrentPosition(function(pos) {
        $scope.position = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);
           // console.log(JSON.stringify($scope.position));

$scope.convert_location = JSON.stringify($scope.position);
$scope.main_location = JSON.parse($scope.convert_location); // here you w'll get user current location lattitude and longitutude


     geocoder.geocode({'latLng': $scope.position}, function (results, status) {
if(status == google.maps.GeocoderStatus.OK) {       
var add=results[1].formatted_address;   // address of user current location

// console.log(add);
}
});

//Used google place api

 var map;
$scope.places_names=[];
   var options = {
        enableHighAccuracy: false
    };
  var pyrmont =  $scope.main_location;
   map = new google.maps.Map(document.getElementById('map'), {
center: pyrmont,
zoom: 14,
mapTypeId: google.maps.MapTypeId.TERRAIN   
`  });`
      var service = new google.maps.places.PlacesService(map);
  service.nearbySearch({

location: pyrmont,
radius: 1000,
types: ['Health']
}, callback);

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

}
// marker
function createMarker(placesname) {
var placeLoc = placesname.geometry.location;
var image = 'icons/finder.png';
var marker = new google.maps.Marker({
map: map,
position: placesname.geometry.location,
icon:image
});
$scope.places_names.push(placesname.name);
console.log(placesname);
}

for google map more info pleaese read gooale map apis


#5

please can u elaborate how to paste the code step by step