Integrate Google Map With ASP.NET

Posted by imomins on September 23, 2012 at 6:55 AM

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Geocoding.aspx.cs" Inherits="ReverseGeocoding" %>

 

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

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

<script language="javascript" type="text/javascript">

 

    var map;

    var geocoder;

    function InitializeMap() {

 

        var latlng = new google.maps.LatLng(-34.397, 150.644);

        var myOptions =

        {

            zoom: 8,

            center: latlng,

            mapTypeId: google.maps.MapTypeId.ROADMAP,

            disableDefaultUI: true

        };

        map = new google.maps.Map(document.getElementById("map"), myOptions);

    }

 

    function FindLocaiton() {

        geocoder = new google.maps.Geocoder();

        InitializeMap();

 

        var address = document.getElementById("addressinput").value;

        geocoder.geocode({ 'address': address }, function (results, status) {

            if (status == google.maps.GeocoderStatus.OK) {

                map.setCenter(results[0].geometry.location);

                var marker = new google.maps.Marker({

                    map: map,

                                   });

 

            }

            else {

                alert("Geocode was not successful for the following reason: " + status);

            }

        });

 

    }

 

 

    function Button1_onclick() {

        FindLocaiton();

    }

 

    window.onload = InitializeMap;

 

</script>

 

<h2>Gecoding Demo JavaScript: </h2>

<table>

<tr>

<td>

    <input id="addressinput" type="text" style="width: 447px" mce_style="width: 447px" />   

</td>

<td>

    <input id="Button1" type="button" value="Find" onclick="return Button1_onclick()" /></td>

</tr>

<tr>

<td colspan ="2">

<div id ="map" style="height: 253px" mce_style="height: 253px" >

</div>

</td>

</tr>

</table>

</asp:Content>

 

 

Categories: JavaScript, ASP.NET, JQUERY

Post a Comment

Oops!

Oops, you forgot something.

Oops!

The words you entered did not match the given text. Please try again.

You must be a member to comment on this page. Sign In or Register

0 Comments