How to Get Latitude and Longitude of a Place Using Google Map API

Introduction

This article describes how to get the latitude and longitude of a location using the Google Map API in ASP.Net. Here I will describe how to communicate with the Google Map API.

Description

To use the Google Map API you need to add the following link to the Head section.

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

Design

Now add two TextBoxes, one Button, and one Label.

Design your screen as in the following screen.

Or you can copy the following source code:

<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
Country :
</td>
<td>
<asp:TextBox ID="txtCon" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
City :
</td>
<td>
<asp:TextBox ID="txtCity" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input id="btn" type="button" value="Search Coordinates" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<asp:Label ID="lblresult" runat="server" ForeColor="Red"></asp:Label>
</td>
</tr>
</table>
</div>
</form>
</body>

Now add the following jQuery and Google map references in the Head section:

<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

Now write the following JavaScript code in the Head section that will communicate with the Google map API.

<script type="text/javascript">
$(document).ready(function () {
$("#btn").click(function () {
var geocoder = new google.maps.Geocoder();
var con = document.getElementById('txtCon').value;
var city = document.getElementById('txtCity').value;
var res = document.getElementById('lblresult');
var com = city + "," + con;
geocoder.geocode({ 'address': com }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
res.innerHTML = "Latitude : " + results[0].geometry.location.lat() + "<br/>Longitude :" +
results[0].geometry.location.lng();
} else {
res.innerHTML = "Wrong Details: " + status;
}
});
});
});
</script>

Now build your application. Enter a City and Country in the respective text boxes then press the button.

It will show the latitude and longitude of that place in the label.

Thank you.