Extract Geocoding Latitude Longitude from Image / Photo using PHP with Google MAP API [SOLVED]

Extract Latittude and Longitude from an photo shot using GPS Enabled device either Smartphone or Digital Camera using PHP & show the location on Google MAP with Marker.

I tried using EXIF.JS & jQuery but failed. PHP is simple and works great.

<!DOCTYPE html> <html> <head> <title></title> </head> <body> <?php function gps2Num($coordPart){ $parts = explode('/', $coordPart); if(count($parts) <= 0) return 0; if(count($parts) == 1) return $parts[0]; return floatval($parts[0]) / floatval($parts[1]); } function get_image_location($image = ''){ $exif = exif_read_data($image, 0, true); if($exif && isset($exif['GPS'])){ $GPSLatitudeRef = $exif['GPS']['GPSLatitudeRef']; $GPSLatitude = $exif['GPS']['GPSLatitude']; $GPSLongitudeRef= $exif['GPS']['GPSLongitudeRef']; $GPSLongitude = $exif['GPS']['GPSLongitude']; $lat_degrees = count($GPSLatitude) > 0 ? gps2Num($GPSLatitude[0]) : 0; $lat_minutes = count($GPSLatitude) > 1 ? gps2Num($GPSLatitude[1]) : 0; $lat_seconds = count($GPSLatitude) > 2 ? gps2Num($GPSLatitude[2]) : 0; $lon_degrees = count($GPSLongitude) > 0 ? gps2Num($GPSLongitude[0]) : 0; $lon_minutes = count($GPSLongitude) > 1 ? gps2Num($GPSLongitude[1]) : 0; $lon_seconds = count($GPSLongitude) > 2 ? gps2Num($GPSLongitude[2]) : 0; $lat_direction = ($GPSLatitudeRef == 'W' or $GPSLatitudeRef == 'S') ? -1 : 1; $lon_direction = ($GPSLongitudeRef == 'W' or $GPSLongitudeRef == 'S') ? -1 : 1; $latitude = $lat_direction * ($lat_degrees + ($lat_minutes / 60) + ($lat_seconds / (60*60))); $longitude = $lon_direction * ($lon_degrees + ($lon_minutes / 60) + ($lon_seconds / (60*60))); return array('latitude'=>$latitude, 'longitude'=>$longitude); }else{ return false; } } $imgURL = 'prop_img/20200419_105335.jpg'; $imgLocation = get_image_location($imgURL); $imgLat = $imgLocation["latitude"]; $imgLng = $imgLocation["longitude"]; echo 'Latittude : ' . $imgLat; echo '<br>longitude : ' . $imgLng . '<br><br>'; ?> <img src="<?php echo $imgURL; ?>" style="width: 150px;"><br><br> <div id="map"></div> <style type="text/css"> #map { width: 500px; height: 500px; } </style> <script> function initMap() { var myLatLng = {lat: <?php echo $imgLat; ?>, lng: <?php echo $imgLng; ?>}; var map = new google.maps.Map(document.getElementById('map'), { zoom: 18, center: myLatLng }); var marker = new google.maps.Marker({ position: myLatLng, map: map, title: 'Hello World!' }); } </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="https://maps.googleapis.com/maps/api/js?key=<?php echo $gmkey; ?>&callback=initMap" async defer></script> </body> </html>