Get Location (Latitude and Longitude) using Google Maps API in AngularJS

Last Reply one month ago By skp

Posted one month ago

How to simply get the latitude, longitude and location in angularjs?

 

Posted one month ago

Hi skp,

Using the below articles i have created the example. 

Check this example. Now please take its reference and correct your code.

Get Current Location Latitude and Longitude using JavaScript and HTML5

Google Maps V3: Get address from Latitude and Longitude

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js"></script>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&key=API_KEY"></script>
    <script type="text/javascript">
        var app = angular.module('MyApp', []);
        app.controller('MyController', function () {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(function (p) {
                    var latlng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
                    var geocoder = geocoder = new google.maps.Geocoder();
                    geocoder.geocode({ 'latLng': latlng }, function (results, status) {
                        if (status == google.maps.GeocoderStatus.OK) {
                            if (results[1]) {
                                alert(
                                "Location: " + results[1].formatted_address +
                                "\nLatitude : " + p.coords.latitude +
                                "\nLongitude : " + p.coords.longitude);
                            }
                        }
                    });
                });
            } else {
                alert('Geo Location feature is not supported in this browser.');
            }
        });
    </script>
</head>
<body ng-app="MyApp" ng-controller="MyController">
</body>
</html>

Screenshot



Posted one month ago

I guess the geolocation doesn't support in http site, but it supports localhost site.

https://jsfiddle.net/deepumohanp/a4g2J/

Only when it comes to https site, it supports.