Click here to Skip to main content
15,123,367 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
hello for all
i use google map api with javascript and html
but i want use this map with "ModalPopupExtender ajax" and my map Will not complete in this ajax control
thank you

my code:

ASP.NET
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GoogleMap.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    
    <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAUvgMDpSwpIVSdk4Lt1gyZxRrPG9ukeNb8tYptMFxTfI6RCHRlBR6oN-gOMyEFzILA_3i60HC7gO7HQ "
        type="text/javascript">
//My Google Maps Key
    </script>

    <script type="text/javascript">

function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl (new GSmallMapControl());
map.addControl(new GMapTypeControl());
var center = new GLatLng(28.922683041889997, 50.833139419555664);
map.setCenter(center, 14);
map.setMapType(G_SATELLITE_MAP);
geocoder = new GClientGeocoder();

var marker = new GMarker(center, {draggable: true}); 
map.addOverlay(marker);
document.getElementById("lat").value = center.lat();
document.getElementById("lng").value = center.lng ();

geocoder = new GClientGeocoder();

GEvent.addListener(marker, "dragend", function() {
var point =marker.getPoint();
map.panTo(point);
document.getElementById("lat").value = point.lat();
document.getElementById("lng").value = point.lng();
});

GEvent.addListener(map, "moveend", function() {
map.clearOverlays();
var center = map.getCenter();
var marker = new GMarker(center, {draggable: true});
map.addOverlay(marker);
document.getElementById ("lat").value = center.lat();
document.getElementById("lng").value = center.lng();

GEvent.addListener(marker, "dragend", function() {
var point =marker.getPoint();
map.panTo(point);
document.getElementById("lat").value = point.lat();
document.getElementById("lng").value = point.lng();
});
});
}
}

function showAddress(address) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
if (geocoder) {
geocoder.getLatLng (
address,
function(point) {
if (!point) {
alert(address + " city not found !");
}
else {
document.getElementById("lat").value = point.lat();
document.getElementById("lng").value = point.lng();
map.clearOverlays()
map.setCenter(point, 14);
var marker = new GMarker(point, {draggable: true}); 
map.addOverlay(marker);

GEvent.addListener(marker, "dragend", function() {
var pt =marker.getPoint();
map.panTo(pt);
document.getElementById("lat").value = pt.lat();
document.getElementById("lng").value = pt.lng();
});

GEvent.addListener(map, "moveend", function() {
map.clearOverlays();
var center = map.getCenter();
var marker = new GMarker(center, {draggable: true});
map.addOverlay(marker);
document.getElementById ("lat").value = center.lat();
document.getElementById("lng").value = center.lng();

GEvent.addListener(marker, "dragend", function() {
var pt =marker.getPoint();
map.panTo(pt);
document.getElementById("lat").value = pt.lat();
document.getElementById("lng").value = pt.lng();
});
});
}}
);
}}
    </script>

</head>
<body onload="load()"  önunload="GUnload()">

    <script language="JavaScript" type="text/javascript">
<!--
var message="";
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all )) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")



// -->
    </script>

    <table>
        <tr>    
            <td style="vertical-align:top;">
                Type city name:
                <form action="#"  önsubmit="showAddress(this.address.value); return false">
                    <input type="text" size="34" name="address" value="Bushehr" />
                    <input type="submit" value="Search!" />
                </form>
               Current coordinates: 
                    <table bgcolor="#FFFFFF" width="300">

                        <tr>
                            <td width="70">
                                Latitude:</td>
                            <td>
                                <input type="text" size="34" name="latitude" value="" id="lat" /></td>
                        </tr>
                        <tr>
                            <td width="70">

                                Longitude:</td>
                            <td>
                                <input type="text" size="34" name="longitude" value="" id="lng" /></td>
                        </tr>
                    </table>
                    <br />
                        <a href="Default.aspx">
                <img src="images/back.png" 
                    style="height: 67px; width: 79px" title="بازگشت"/>                   
                    </a>
                <br />    
                         
                    <a href="Default.aspx">
                            بازگشت
                    </a>  
                    </td>
            <td>
                <div align="center" id="map" style="width: 900px; height: 600px">
                </div>
            </td>
        </tr>
    </table>
</body>
</html>
Posted
Updated 25-Aug-11 20:29pm
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900