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:
<%@ 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">
</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>