<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" CodeFile="googleSure.aspx.cs"
Inherits="googleSure" %>
<html>
<head>
<title></title>
<style>
body
{
font-size: 12px;
background-color: White;
}
*
{
font-size: 12px;
}
</style>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css"
rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script src="Scripts/IFrameWindow.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
</head>
<body>
<form runat="server" id="form1">
<div style="height: 25; line-height: 25px; text-align: right; padding-right: 15px;
background-color: #eee; margin-bottom: 30px;">
<input id="Button1" οnclick="CloseMe(0)" style="cursor: pointer; border: 0px; color: Red;
text-decoration: underline" type="button" value="关闭地图" />
</div>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="60%">
<div>
输入地址:<input type="text" size="10" id="putaddress" /><input type="button" οnclick="getLocAddress()"
value="搜索" />
</div>
<div style="width: 100%; height: 340px; border: 1px solid gray" id="map_canvas">
</div>
</td>
<td valign="top" style="padding-left: 10px;">
<b style="color: Red">我现处位置:</b><br />
<input type="hidden" id="lat">
<input type="hidden" id="lng">
<script type="text/javascript">
//获取父窗体信息
var parentLat = $('#lat', parent.document).val();
var parentLng = $('#lng', parent.document).val();
if (parentLat == "" || parentLng == "") {
parentLat = "120.2";
parentLng = "30.3";
}
var parentname = $('#thename', parent.document).html();
var parentaddress = $('#address', parent.document).html();
var parentLayer = $('#layer', parent.document).html();
var BigType = $('#BigTypeId', parent.document).val();
var SmallType = $('#SmallTypeId', parent.document).val();
var isstart = true;
//数据提交
function onsumbit() {
if ($("#name").val() == "") {
alert("请填写名称");
return false;
}
if ($("#address").val() == "") {
alert("请填写地址信息,或者重新地位您所在的地址");
return false;
}
//设置父窗体数据
$('#lat', parent.document).val($("#lat").val());
$('#lng', parent.document).val($("#lng").val());
$('#thename', parent.document).html($("#name").val());
$('#address', parent.document).html($("#address").val());
$('#layer', parent.document).html($("#layer").val());
$('#TypeName1', parent.document).html($("#DDL_BigType").find("option:selected").text());
$('#TypeName2', parent.document).html($("#DDL_Smalltype").find("option:selected").text());
$('#BigTypeId', parent.document).val($("#DDL_BigType").val());
$('#SmallTypeId', parent.document).val($("#DDL_Smalltype").val());
$('#HasUpdate', parent.document).val("1");
CloseMe(0);
}
function setBtShow(btId) {
document.getElementById(btId).style.display = "";
}
function setBtHidden(btId) {
document.getElementById(btId).style.display = "none";
}
function setInputNull(inputId) {
document.getElementById(inputId).value = "";
}
GetSmallType = function (bbid) {
$.get("./GetPlaceCategory.aspx", { bid: bbid }, function (data, textStatus) {
//返回的 data 可以是 xmlDoc, jsonObj, html, text, 等等.
this; // 在这里this指向的是Ajax请求的选项配置信息,请参考下图
formatString(data);
});
}
function formatString(data) {
var typeList = data.split('&');
$("#Select2").find("option").remove();
var options = "<option value=''>--二级场所信息--</option>";
for (i = 0; i < typeList.length; i++) {
if (typeList[i] != "")
options += "<option value='" + typeList[i].split('|')[0] + "'>" + typeList[i].split('|')[1] + "</option>";
}
$('#DDL_Smalltype').html(options);
if (isstart) {
$('#DDL_Smalltype').val(SmallType);
isstart = false;
}
}
</script>
<style>
.outdiv
{
border: 1px #ccc solid;
height: 20px;
margin-bottom: 5px;
}
.put
{
border: 0px;
height: 18px;
}
.btDelete
{
height: 18px;
cursor: pointer;
border: 0px;
background-color: White;
width: 18px;
font-size: 18px;
overflow: hidden;
line-height: 18px;
}
.tdheight td, select
{
padding-bottom: 5px;
}
</style>
<table border="0" class="tdheight" cellpadding="0" cellspacing="0">
<tr>
<td>
名称:
</td>
<td>
<div style="width: 155px;" class="outdiv" οnmοusemοve="setBtShow('bt_name')" οnmοuseοut="setBtHidden('bt_name')">
<input class="put" type="text" id="name"><input class="btDelete" οnclick="setInputNull('name')"
title="点击清空" style="display: none" id="bt_name" type="button" value="×" />
</div>
</td>
</tr>
<tr>
<td>
地址:
</td>
<td>
<div class="outdiv" style="width: 205px;" οnmοusemοve="setBtShow('bt_address')" οnmοuseοut="setBtHidden('bt_address')">
<input type="text" class="put" id="address" size="30"><input class="btDelete" οnclick="setInputNull('address')"
title="点击清空" style="display: none" id="bt_address" type="button" value="×" />
</div>
</td>
</tr>
<tr>
<td>
楼层:
</td>
<td>
<input type="text" size="5" maxlength="5" id="layer" />
楼
</td>
</tr>
<tr>
<td valign="top">
场所类型:
</td>
<td>
<asp:DropDownList ID="DDL_BigType" οnchange="GetSmallType($('#DDL_BigType').val())"
runat="server">
<asp:ListItem Text="--一级场所信息--" Value=""></asp:ListItem>
</asp:DropDownList>
<br />
<br />
<select id="DDL_Smalltype">
<option>--二级场所信息--</option>
</select>
</td>
</tr>
<tr>
<td>
</td>
<td>
<input id="Submit1" οnclick="return onsumbit()" type="button" value="提交" />
</td>
</tr>
</table>
</td>
</tr>
</table>
<script type="text/javascript">
if (BigType != "") {
$("#DDL_BigType").val(BigType);
GetSmallType(BigType);
}
$("#lat").val(parentLat);
$("#lng").val(parentLng);
$("#name").val(parentname);
$("#layer").val(parentLayer);
// 初始化地图,设置中心点坐标和地图级别。
var geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 5,
center: new google.maps.LatLng(parentLng, parentLat),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var image = "";
var imagegreen = "http://labs.google.com/ridefinder/images/mm_20_green.png";
var myLatLng = new google.maps.LatLng(parentLng, parentLat);
var beachMarker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image,
draggable: true
});
//移动标记
google.maps.event.addListener(beachMarker,
'dragend',
function (result) {
var _lat = result.latLng.lat();
var _lng = result.latLng.lng();
getAreaName(_lat, _lng);
});
if (parentaddress == "")
getAreaName(parentLng, parentLat)
else {
$("#address").val(parentaddress);
infowindow = new google.maps.InfoWindow();
infowindow.setContent("<b>当前位置:</b><br>" + parentaddress);
infowindow.setPosition(myLatLng);
infowindow.open(map);
}
var Ginfowindow = new google.maps.InfoWindow();
//地址反解析
function getAreaName(lat, lng) {
$("#lat").val(lng);
$("#lng").val(lat);
var resultstr = "";
var latlng = new google.maps.LatLng(lat, lng);
geocoder.geocode({ 'latLng': latlng }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0].formatted_address != "") {
var _address = results[0].formatted_address;
$("#address").val(_address);
infowindow.close();
infowindow = new google.maps.InfoWindow();
infowindow.setContent("<b>当前位置:</b><br>" + _address);
infowindow.setPosition(latlng);
infowindow.open(map);
Ginfowindow = infowindow;
}
}
});
}
//地址解析
// 将地址解析结果显示在地图上,并调整地图视野
function getLocAddress() {
var _address = $('#putaddress').val();
if (_address == "") {
alert("请输入地址");
return;
}
if (geocoder) {
geocoder.geocode({ 'address': _address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
getAreaName(results[0].geometry.location.lat(), results[0].geometry.location.lng());
}
else {
alert("地位失败,建议您先大范围定位,然后具体定位");
}
});
}
}
</script>
</form>
</body>
</html>
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeFile="google.aspx.cs" Inherits="google" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="68%">
<div style="width: 100%; height: 340px; border: 1px solid gray" id="map_canvas">
</div>
</td>
<td width="30%" valign="top" style="padding-left: 10px; line-height:30px;">
<b style="color: Red">我现处位置:</b><br />
<input type="hidden" id="lat" value="120.3">
<input type="hidden" id="lng" value="30.3">
名称:<span id="thename">阿里巴巴网</span><br />
地址:<span id="address">浙江省杭州市</span><br />
楼层:<span id="layer">12</span> 楼<br />
场所类型:<span id="TypeName1">住宿</span> - <span id="TypeName2">写字楼</span>
<input type="hidden" id="BigTypeId" value="16" />
<input type="hidden" id="SmallTypeId" value="1604" />
<div>
<input οnclick="DoLoadIframeInPage(800, 500, 'googleSure.aspx', 0)" id="Submit1" type="button" value="我还可以再精确" />
</div>
<input type="hidden" id="HasUpdate" value="1" />
</td>
</tr>
</table>
<script type="text/javascript">
function initialize() {
if ($("#HasUpdate").val() == 0)
return;
var lattxt = $("#lat").val();
var lngtxt = $("#lng").val();
var Prompt = $("#address").html();
var myOptions = {
zoom: 5,
center: new google.maps.LatLng(lngtxt, lattxt),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var myLatLng = new google.maps.LatLng(lngtxt, lattxt);
var beachMarker = new google.maps.Marker({
position: myLatLng,
map: map
});
infowindow = new google.maps.InfoWindow();
infowindow.setContent("<b>当前位置:</b><br>" + Prompt);
infowindow.setPosition(myLatLng);
infowindow.open(map);
$("#HasUpdate").val("0");
}
window.onload = initialize;
setInterval(initialize,1000);
</script>
</asp:Content>