Code Simplified – Viral Sarvaiya

Code Simplified – Viral Sarvaiya, Web Developer Friends, dot net Developer, Sql Server Developer

Google Maps API in ASP.Net

Posted by Viral Sarvaiya on July 10, 2009

In this article, I am explaining how to use Google Map API with ASP.Net. First you need to register with the Google Maps API here and get your key from Google.

Once you get the key. You can display Google Maps on you Website using the following script that you get from Google.


<head id="Head1" runat="server">

<title>Google Maps Example</title>

<script type="text/javascript"

src="http://www.google.com/jsapi?key=xxxxxxx"></script>

<script type="text/javascript">

google.load("maps", "2");

// Call this function when the page has been loaded

function initialize() {

var map = new google.maps.Map2(document.getElementById("map"));

map.setCenter(new google.maps.LatLng("<%=lat%>", "<%=lon%>"), 5);

var point = new GPoint("<%=lon%>", "<%=lat%>");

var marker = new GMarker(point);

map.addOverlay(marker);

map.addControl(new GLargeMapControl());

}

google.setOnLoadCallback(initialize);

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<div id="map" style="width: 400px; height: 400px"></div>

</div>

</form>

</body>

As you can see I have placed the script in the Head section of the HTML page. The above script gives your location on the map based on latitude and longitude. The map is loaded in the div with id map

Now to get Latitude and Longitude we will take help of my previous article Find Visitor’s Geographic Location using IP Address in ASP.Net. You’ll notice I have used to server variables lat (latitude) and lon (longitude) whose values come from server.

Based on the IP address the web service returns the latitude and longitude refer the XML below


<?xml version="1.0" encoding="UTF-8" ?>

<Response>

<Status>true</Status>

<Ip>122.169.8.137</Ip>

<CountryCode>IN</CountryCode>

<CountryName>India</CountryName>

<RegionCode>16</RegionCode>

<RegionName>Maharashtra</RegionName>

<City>Bombay</City>

<ZipCode />

<Latitude>18.975</Latitude>

<Longitude>72.8258</Longitude>

</Response>

code for vb page


Protected lat As String, lon As String

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)  Handles Me.Load

Dim ipaddress As String

ipaddress = Request.ServerVariables("HTTP_X_FORWARDED_FOR")

If ipaddress = "" OrElse ipaddress Is Nothing Then

ipaddress = Request.ServerVariables("REMOTE_ADDR")

End If

Dim dt As DataTable = GetLocation(ipaddress)

If dt IsNot Nothing Then

If dt.Rows.Count > 0 Then

lat = dt.Rows(0)("Latitude").ToString()

lon = dt.Rows(0)("Longitude").ToString()

End If

End If

End Sub

Private Function GetLocation(ByVal ipaddress As String) As DataTable

'Create a WebRequest

Dim rssReq As WebRequest = WebRequest. _

Create("http://freegeoip.appspot.com/xml/" & ipaddress)

'Create a Proxy

Dim px As New WebProxy("http://freegeoip.appspot.com/xml/" _

& ipaddress, True)

'Assign the proxy to the WebRequest

rssReq.Proxy = px

'Set the timeout in Seconds for the WebRequest

rssReq.Timeout = 2000

Try

'Get the WebResponse

Dim rep As WebResponse = rssReq.GetResponse()

'Read the Response in a XMLTextReader

Dim xtr As New XmlTextReader(rep.GetResponseStream())

'Create a new DataSet

Dim ds As New DataSet()

'Read the Response into the DataSet

ds.ReadXml(xtr)

Return ds.Tables(0)

Catch

Return Nothing

End Try

End Function

As you can see in the above code snippet I get the latitude and longitude from the XML Response in the variables lat and lon which I’ll used to pass values to the JavaScript function of the Google API.

for more information please click here

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: