<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf8719&v=1.1&services=true"></script>
<script type="text/javascript">
function getAddr() {
var map = document.getElementById("dituContent");
var a = 1;
if (a == 1) {
a = 2;
initMap();
}
else {
if (map.style.display == "none") {
map.style.display = "block";
initMap();
} else {
map.style.display = "none";
}
}
}
</script>
<body>
<div id="divContent">
<div>
<table>
<tr>
<td style="min-width: 35; border-top: 50">
<table style="content: no-open-quote">
<tr>
<td style="text-align: right;">
</td>
<td style="text-align: left;" class="style8" colspan="2">
</td>
</tr>
<tr>
<td style="text-align: right;">
<span class="MD_spaninput"> </span>
</td>
<td style="text-align: left;">
</td>
<td style="text-align: left;">
</td>
</tr>
<tr>
<td style="text-align: right;">
</td>
<td style="text-align: left;">
</td>
<td style="text-align: left;">
</td>
</tr>
<tr>
<td style="text-align: right;">
</td>
<td style="text-align: left;">
</td>
<td style="text-align: left;">
</td>
</tr>
<tr>
<td style="text-align: right;">
</td>
<td style="text-align: left;">
<input id="i_IdentityCard1" name="n_IdentityCard1" type="text" value="" />
</td>
<td style="text-align: left;">
<input id="Button3" class="btn_3zico" type="button" value="标注地址" onclick="getAddr()" />
</td>
</tr>
<tr>
<td>
</td>
<td style="text-align: left;">
</td>
<td style="text-align: left;">
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td rowspan="6">
<div style="width: 1555px; height: 800px; border: #ccc solid 1px; margin-left: 20px;
float: left; display: block" id="dituContent">
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
<!--选择后地图的坐标-->
<input type="hidden" id="lng" name="n_lng" />
<input type="hidden" id="lat" name="n_lat" />
</body>
</html>
<script type="text/javascript">
//创建和初始化地图函数：
function initMap() {
createMap(); //创建地图
setMapEvent(); //设置地图事件
var gc = new BMap.Geocoder();
var opts = {
width: 300, // 信息窗口宽度 如果指定的宽度为0，则信息窗口的宽度将按照其内容自动调整
height: 0, // 信息窗口高度 如果指定的高度为0，则信息窗口的高度将按照其内容自动调整
title: "《我爱我的家乡，我爱山西，我爱太原》", // 信息窗口标题
enableMessage: false //设置允许信息窗发送短息
//message:"亲耐滴，晚上一起吃个饭吧？戳看下地址喔~" //这个是指短信内容
}
map.addEventListener("click", function (e) {
var pt = e.point;
gc.getLocation(pt, function (rs) {
var addComp = rs.addressComponents;
var addr;
addr = addComp.city + addComp.district + addComp.street + addComp.streetNumber;
var infoWindow = new BMap.InfoWindow(addr, opts);
map.clearOverlays(); //删除之前标注
var marker = new BMap.Marker(pt);
map.addOverlay(marker);
marker.openInfoWindow(infoWindow);
document.getElementById("i_IdentityCard1").value = addr;
document.getElementById("lng").value = pt.lng;
document.getElementById("lat").value = pt.lat;
});
});
}
//创建地图函数：
function createMap() {
var map = new BMap.Map("dituContent"); //在百度地图容器中创建一个地图
// 创建地址解析器实例
var myGeo = new BMap.Geocoder();
// 将地址解析结果显示在地图上,并调整地图视野
myGeo.getPoint("太原", function (point) {
if (point) {
map.centerAndZoom(point, 14);
}
}, "太原");
window.map = map; //将map变量存储在全局
}
function createMaps() {
var map = new BMap.Map("dituContent"); //在百度地图容器中创建一个地图
// 创建地址解析器实例
var myGeo = new BMap.Geocoder();
// 将地址解析结果显示在地图上,并调整地图视野
myGeo.getPoint(document.getElementById("address").value, function (point) {
if (point) {
map.centerAndZoom(point, 14);
}
}, document.getElementById("address").value);
window.map = map; //将map变量存储在全局
}
//地图事件设置函数：
function setMapEvent() {
map.enableDragging(); //启用地图拖拽事件，默认启用(可不写)
map.enableScrollWheelZoom(); //启用地图滚轮放大缩小
map.enableDoubleClickZoom(); //启用鼠标双击放大，默认启用(可不写)
map.enableKeyboard(); //启用键盘上下左右键移动地图
map.addControl(new BMap.NavigationControl()); // 添加平移缩放控件
map.addControl(new BMap.ScaleControl()); // 添�
- 1
- 2
前往页