百度地图标注地址
内含 用地名匹配经纬度方法 点击地图获取经纬度 相关信息赋予标注点 地图全屏(非浏览器方法) 以及相关地图控件
上代码：
jsp inculde页面：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
<head>
<script type="text/javascript" src="resource/js/jquery.js"></script>
<script type="text/javascript" src="resource/js/jqueryEasyUI/jquery.easyui.js"></script>
<link href="resource/js/jqueryEasyUI/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="resource/js/jqueryEasyUI/themes/icon.css" type="text/css"></link>
<script type="text/javascript" src="resource/js/common/validate.js"></script>
<script type="text/javascript" src="resource/js/common/jquery.mask.js"></script>
<script type="text/javascript" src="resource/js/zTree/jquery.ztree.js"></script>
<link href="resource/js/zTree/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="resource/js/common/groupSelTree.js"></script>
<script type="text/javascript" src="resource/js/My97DatePicker/WdatePicker.js"></script>
<link href="resource/css/rcms_edit.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="resource/css/list.css" media="all" />
</head>
<body >
<div id="test1" class="bodyDiv" >
<!-- 地图标注 -->
<div id="one">
<jsp:include page="dzdt_edit.jsp"></jsp:include>
</div>
<div id="two">
<!-- 地图浏览 -->
<jsp:include page="dzdt_map.jsp"></jsp:include>
</div>
</div>
</body>
</html>
地图信息编辑模块：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=FtppmMikPUX6swgTT3L75eKXX6j1ZsRC"></script>
<script type="text/javascript" src="resource/js/jquery.js"></script>
<script type="text/javascript" src="resource/js/jqueryEasyUI/jquery.easyui.js"></script>
<link href="resource/js/jqueryEasyUI/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="resource/js/jqueryEasyUI/themes/icon.css" type="text/css"></link>
<script type="text/javascript" src="resource/js/common/validate.js"></script>
<script type="text/javascript" src="resource/js/common/jquery.mask.js"></script>
<script type="text/javascript" src="resource/js/zTree/jquery.ztree.js"></script>
<link href="resource/js/zTree/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="resource/js/common/groupSelTree.js"></script>
<link href="resource/css/rcms_edit.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="resource/css/list.css" media="all" />
</head>
<script type="text/javascript">
var strRight = '<c:forEach var="op" items="${opList}" varStatus="s"><c:if test="${s.index > 0}">,</c:if><c:out value="${op}" /></c:forEach>';/*opList对象是一个按钮权限 */
var model='<c:out value="${MODEL_CODE}" />';
/* 刷新方法 */
function refesh(){
window.location.reload();
}
/*设置全局变量 从库中拿取数据以便后面判断打印不能打印未保存数据*/
var model="${MODEL_CODE}";
var qymc="${dt.qymc}";
var zs="${dt.zs}" ;
var qrr="${dt.qrr}";
var qrrlxdh="${dt.qrrlxdh}";
var fr="${dt.fr}";
var frlxdh="${dt.frlxdh}";
$.extend($.fn.validatebox.defaults.rules, {
phone: {// 验证电话号码
validator: function (value) {
return /(^((\d2,3)|(\d{3}\-))?(0\d2,3|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$)|(^(13|15|18)\d{9}$)|(^(\s*)$)/i.test(value);
},
message: '格式不正确,请使用座机格式:020-88888888 或者 手机号码格式'
},
});
/* 页面一刷新，将之前页面数据保留在输入框中 */
$(function (){
$('#zs').val("${dt.zs}");
$('#qymc').val("${dt.qymc}");
$('#jd').val("${dt.zbjd}");
$('#wd').val("${dt.zbwd}");
$('#qrr').val("${dt.qrr}");
$('#qrrlxdh').val("${dt.qrrlxdh}");
$('#fr').val("${dt.fr}");
$('#frlxdh').val("${dt.frlxdh}");
$('#wtdlr').val("${dt.wtdlr}");
$('#wtdllxdh').val("${dt.wtdllxdh}");
});
function openSubjectNameDialog()
{
top.toSelList
(
model+'!toCompanyChoose.action', // 查询的市场主体名称
'选择市场主体名称',
1 ,
function(arrayTitle,curContent) /* 0:id 1:wybm 2:qymc 3:zs 4:zbjd 5:zbwd 6:scztlxr 7:scztlxdh 8:qrr 9:qrrlxdh 10:qrsj 11:jtms 12:fr 13:frlxdh */
{
$('#id').val(curContent[0][0]);
$('#cx').val(curContent[0][3]);
$('#zs').val(curContent[0][9]);
$('#qymc').val(curContent[0][3]);
$('#fr').val(curContent[0][6]);
$('#frlxdh').val(curContent[0][22]);
// $('#jd').val(curContent[0][4]);
// $('#wd').val(curContent[0][5]);
/* 企业选择后定位 */
var jd= $('#jd').val();
if(jd.length>0){
var wd= $('#wd').val();
var point = new BMap.Point(jd, wd); //创地图对象，设置上已经添加的经纬度
map.centerAndZoom(point,20); // 初始化地图d
addMarker(point); //标注初始化经纬度
/* 地图文字标注 */
var fr= $('#fr').val();
var frlxdh=$('#frlxdh').val();
var zs= $('#zs').val();
var opts = {
position : point, // 指定文本标注所在的地理位置
offset : new BMap.Size(30, -30) //设置文本偏移量
};
var label = new BMap.Label("法定代表人:"+fr+"<br/>" +"法定代表人联系电话:"+frlxdh+"<br/>" +"经营地址:"+zs, opts); // 创建文本标注对象
label.setStyle({
color : "black",
fontSize : "12px",
});
map.addOverlay(label);
}
}
);
}
/* 清空功能 */
function clearSearch(){
$("#cx").val("");
$("#qymc").val("");
$("#zs").val("");
$("#qrr").val("");
$("#qrrlxdh").val("");
$("#fr").val("");
$("#frlxdh").val("");
}
/* 打印页面 &&判断企业是否已经保存*/
function open_printWindow(){
var input_zs=$('#zs').val();
/* var input_scztlxr=$('#scztlxr').val();
var input_scztlxdh= $('#scztlxdh').val();
var input_qrr=$('#qrr').val();
var input_qrrlxdh= $('#qrrlxdh').val();
var input_fr=$('#fr').val();
var input_frlxdh= $('#frlxdh').val(); */
var input_qymc=$('#qymc').val();
if(checkspace(document.mainForm.qymc.value)) {
document.mainForm.qymc.focus();
alert("未填写市场主体名称!");
return false;
}
/* if(checkspace(document.mainForm.scztlxr.value)) {
document.mainForm.scztlxr.focus();
alert("未填写市场主体联系人姓名!");
return false;
}
//联系方式合法性验证
if(checkspace(document.mainForm.scztlxdh.value)) {
document.mainForm.scztlxdh.focus();
alert("未填写市场主体联系电话!");
return false;
} */
/* if(checkphone(document.mainForm.scztlxdh.value)) {
document.mainForm.scztlxdh.focus();
alert("未填写市场主体联系");
return false;
} */
/* if(checkspace(document.mainForm.frlxdh.value)) {
document.mainForm.frlxdh.focus();
alert("未填写法定代表人联系电话!");
return false;
}
*/
if(checkphone(document.mainForm.frlxdh.value)) {
document.mainForm.frlxdh.focus();
alert("未填写法定代表人联系电话");
return false;
}
/* if(checkspace(document.mainForm.fr.value)) {
document.mainForm.fr.focus();
alert("未填写法人代表姓名!");
return false;
} */
/*
if(checkspace(document.mainForm.qrr.value)) {
document.mainForm.qrr.focus();
alert("未填写确认人姓名!");
return false;
}
*/
/* if(checkspace(document.mainForm.qrrlxdh.value)) {
document.mainForm.qrrlxdh.focus();
alert("未填写确认人联系电话!");
return false;
} */
if(checkphone(document.mainForm.qrrlxdh.value)) {
document.mainForm.qrrlxdh.focus();
alert("未填写确认人联系电话!");
return false;
}
if(checkspace(document.mainForm.zs.value)) {
document.mainForm.zs.focus();
alert("未填写公司经营地址!");
return false;
}
if(${dt.printState!=1}){ // 打印状态不等于1 打印前
if(confirm("确定打印后,数据将不能再保存")){
/* 判断是否为空，或者库 */
if(qymc==undefined||qymc==""||qymc==null||qymc!=input_qymc||
zs==undefined||zs==""||zs==null||zs!=input_zs){
alert("企业配置未保存，无法打印");
}else{
var id="${id}";
window.open("dzdt!printPage.action?id="+id);
refesh();
}
}
}else{ //打印后
var id="${id}";
window.open("dzdt!printPage.action?id="+id);
refesh();
}
}
/* 判断是否为空，判断数据库中是否有值 */
/* 普通字段必填功能*/
function checkspace(checkstr) {
var str = '';
for(i = 0; i < checkstr.length; i++) {
str = str + ' ';
}
return (str == checkstr);
}
/* 手机号码正确性校验 */
function checkphone(mobile){
var myreg = /(^((\d2,3)|(\d{3}\-))?(0\d2,3|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$)|(^(13|15|18)\d{9}$)|(^(\s*)$)/; //验证130-139,150-159,180-189号码段的手机号码 /\d{3}-\d{8}|\d{4}-\d{7}/
if(!myreg.test(mobile))
{
alert('请输入有效的联系方式号码！');
return true;
}
}
/*ajax保存数据 */
function dataSubmit(){
/* 必填项功能 */
/* */
var ids="${dt.id}";
if(ids.length>0){
$.ajax({
type: "POST",
url:model+"!addDzdt.action?id="+ids,
dataType:"json",
data:$('#mainForm').serialize(),// 你的formid
async: false,
error: function(request) {
alert("不能重复保存");
},
success: function(data) {
alert("更新成功");
success(data.id);
}
});
}else{
$.ajax({
type: "POST",
url:model+"!addDzdt.action",
dataType:"json",
data:$('#mainForm').serialize(),// 你的formid
async: false,
error: function(request) {
alert("不能重复保存");
},
success: function(data) {
alert("保存成功");
success(data.id);
}
});
}
}
/*保存成功后刷新 */
function success(id){
window.location=model+'!MapList.action?wybm='+id;
}
</script>
<body>
<div id="noprint" class="right-m headDiv" style="width: 100%;">
<table id="top" border="0"
cellspacing="1" cellpadding="0" width="100%" class="table_style">
<tr>
<td align="right" style="width: 100px;">市场主体名称:</td>
<td align="left" class="twotd">
<c:if test="${dt.printState!=1}">
<input type="button" value="保存" id="tj" class="buttonCss" οnclick="dataSubmit();"/>
</c:if>
<input type="button" id="print" value="打印" class="buttonCss" οnclick="open_printWindow();"/>
<input type="button" value="清空" class="buttonCss" οnclick="clearSearch();"/>
<input type="text" id="cx" name="qymc" value=""/>
<input class="buttonCss" type="button" value="请选择" οnclick="openSubjectNameDialog();"/>
</td>
<td align="right" >唯一编码:</td>
<td align="left" class="twotd" style="width: 50%">
${dt.wybm }
</td>
</tr>
</table>
</div>
<form id="mainForm" name="mainForm" action="<c:out value="${MODEL_CODE}"/>!addDzdt.action" method="post" success="success()" >
<table id="two" border="1" align="center" cellspacing="0" cellpadding="0" width="100%" class="table_style">
<tr class="title">
<td colspan="4"><a href="javascript:void(0)"> 企业信息配置（<span>*</span>表示必填）</a></td>
</tr>
<tr>
<td align="center"><font style="color:red">*</font>市场主体名称:</td>
<td class="input_td" colspan="3">
<input type="text" class="easyui-validatebox" uirequired="true" style="width: 100%;" id="qymc" name="qymc" value=""></td>
<input type="hidden" id="jd" name="zbjd" value="">
<input type="hidden" id="wd" name="zbwd" value="">
<input type="hidden" id="wybm" name="wybm" value="${dt.wybm }">
</tr>
<tr>
<td align="center">法定代表人:</td>
<td><input type="text" id="fr" style="width: 100%" name="fr" value="" class="easyui-validatebox" /></td>
<td align="center">法定代表人联系电话:</td>
<td><input type="text" placeholder="请输入座机号或者手机号" class="easyui-validatebox" validtype="phone" id="frlxdh" style="width: 100%"name="frlxdh" value=""/></td>
</tr>
<tr>
<td align="center">确认人:</td>
<td><input type="text" id="qrr" style="width: 100%" name="qrr" value="" class="easyui-validatebox"></td>
<td align="center">确认人联系电话:</td>
<td><input type="text" id="qrrlxdh" name="qrrlxdh" class="easyui-validatebox" placeholder="请输入座机号或者手机号" validtype="phone" style="width: 100%" value=""></td>
</tr>
<tr>
<td align="center">委托代理人:</td>
<td><input type="text" id="wtdlr" name="wtdlr" style="width: 100%" value="" class="easyui-validatebox" ></td>
<td align="center">委托代理联系电话:</td>
<td><input type="text" id="wtdllxdh" name="wtdllxdh" class="easyui-validatebox" placeholder="请输入座机号或者手机号" validtype="phone" style="width: 100%" value=""></td>
</tr>
<tr>
<td align="center" >
住所(经营地址):
</td>
<td align="center" class="input_td" colspan="3" >
<textarea class="easyui-validatebox" placeholder="选择地址后请选择下面的定位查询" uirequired="true" id="zs" name="zs" style="width: 100%;" cols="20" rows="5"><c:out value=""/></textarea>
</td>
</tr>
</table>
</form>
</body>
</html>
地图模块：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<link href="resource/css/rcms_edit.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/*定义地图容器 */
body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
/* 取消百度地图logo方法 */
.BMap_cpyCtrl
{
display:none;
}
.anchorBL{
display:none;
}
</style>
<!-- 全屏调用功能 -->
<!--先渲染后加载 -->
<!-- 百度地图api -->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=FtppmMikPUX6swgTT3L75eKXX6j1ZsRC"></script>
<!-- 页面布局 -->
<link href="resource/css/rcms_edit.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="resource/css/list.css" media="all" />
<!-- 全屏 -->
<tags:checkFrame />
</head>
<body>
<div class="bottomDiv">
<div>
<input type="button" value="定位查询" οnclick="searchByStationName();" class="btn" style="border:none;"/>
<font color='#ff0000'>*</font>定位后，请手动点击精确位置。
<input id="btn" type="button" class="btn" style="border:none;" value="切换全屏" οnclick="fullMap()"/>
</div>
<div style="width:100%;height:100%;border:2px solid gray" id="allmap"></div>
</div>
</body>
<script type="text/javascript">
/* 设置全局变量 */
var model="${MODEL_CODE}";
var jd,wd;
jd="${dt.zbjd}";
wd="${dt.zbwd}";
var markersArray = [];
/* 创建地图 */
var map = new BMap.Map("allmap",{enableMapClick:false});
/* 一加载，判断坐标是否存在，存在显示，不存在使用原始坐标 */
if(jd==null||jd==undefined||jd==''){
var initjd="112.508074";
var initwd="23.056833";
var point = new BMap.Point(initjd, initwd); //创地图对象，设置上已经添加的经纬度
map.centerAndZoom(point,15); // 初始化地图
addMarker(point); //标注初始化经纬度
map.enableScrollWheelZoom(true); //滚动条
map.addEventListener("click", showInfo); //增加事件监听器
/* 测试 */
/* var localSearch = new BMap.LocalSearch(map);
localSearch.enableAutoViewport(); //允许自动调节窗体大小 */
/* 查找方位 */
function searchByStationName() {
var myGeo=new BMap.Geocoder();
myGeo.getPoint($('#zs').val(), function(point){
if (point) {
document.getElementById('jd').value = point.lng; //经度的赋值
document.getElementById('wd').value = point.lat; //维度的赋值
map.centerAndZoom(point, 16);
// one=map.addOverlay(new BMap.Marker(point));
}
});
/* var poi = searchResult.getPoi(0);
map.centerAndZoom(poi.point, 15); */
/* var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat)); // 创建标注，为要查询的地方对应的经纬度
map.addOverlay(marker);
*/ /* var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");
*/
// marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });
// marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
// });
// localSearch.search(keyword);
}
}else{
var point = new BMap.Point(jd, wd); //创地图对象，设置上已经添加的经纬度
map.centerAndZoom(point,15); // 初始化地图
addMarker(point); //标注初始化经纬度
/* 地图文字标注 */
var opts = {
position : point, // 指定文本标注所在的地理位置
offset : new BMap.Size(-45, -0) //设置文本偏移量
};
var label1 = new BMap.Label("市场主体名称:"+"${dt.qymc}"+"<br/>"+"法人代表:"+"${dt.fr}"+"<br/>" +"法人联系电话:"+"${dt.frlxdh}"+"<br/>"+"地址:"+"${dt.zs}", opts); // 创建文本标注对象
label1.setStyle({
color : "black", //文本字体颜色
fontSize : "15px" // 文本内字体大小
});
map.addOverlay(label1);
map.enableScrollWheelZoom(true); //滚动条
map.addEventListener("click", showInfo); //增加事件监听器
/* 用地名匹配经纬度 */
var localSearch = new BMap.LocalSearch(map);
localSearch.enableAutoViewport(); //允许自动调节窗体大小
function searchByStationName() {
var myGeo=new BMap.Geocoder();
myGeo.getPoint($('#zs').val(), function(point){
if (point) {
document.getElementById('jd').value = point.lng; //经度的赋值
document.getElementById('wd').value = point.lat; //维度的赋值
map.centerAndZoom(point, 16);
// one=map.addOverlay(new BMap.Marker(point));
}
});
}
}
// 将地址解析结果显示在地图上，并调整地图视野
/* 地图工具 */
//1.点击获取经纬度
function showInfo(e) {
document.getElementById('jd').value = e.point.lng; //经度的赋值
document.getElementById('wd').value = e.point.lat; //维度的赋值
new BMap.Geocoder().getLocation(e.point, function (rs) {
var addComp = rs.addressComponents;
var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
if (confirm("确认：地址为" + address + "?")) {
}
});
addMarker(e.point);
}
//2.清除标识
function clearOverlays() {
if (markersArray) {
for (i in markersArray) {
map.removeOverlay(markersArray[i]);
}
}
}
//3.地图上标注
function addMarker(point) {
var marker = new BMap.Marker(point);
markersArray.push(marker);
clearOverlays();
map.addOverlay(marker);
}
// 4.地图定位功能
// 添加带有定位的导航控件
var navigationControl = new BMap.NavigationControl({
// 靠左上角位置
anchor: BMAP_ANCHOR_TOP_LEFT,
// LARGE类型
type: BMAP_NAVIGATION_CONTROL_LARGE,
// 启用显示定位
enableGeolocation: true // 会多出一个点
});
map.addControl(navigationControl);
map.addControl(new BMap.OverviewMapControl()); //添加默认缩略地图控件
var geolocationControl = new BMap.GeolocationControl();
geolocationControl.addEventListener("locationSuccess", function(e){
// 定位成功事件
var address = '';
address += e.addressComponent.province;
address += e.addressComponent.city;
address += e.addressComponent.district;
address += e.addressComponent.street;
address += e.addressComponent.streetNumber;
alert("当前定位地址为：" + address);
});
geolocationControl.addEventListener("locationError",function(e){
// 定位失败事件
alert(e.message);
});
map.addControl(geolocationControl);
</script>
<script type="text/javascript">
/*全屏方法 */
/*1. 获取页面数据 ，页面数据带到跳转到的全屏子页面*/
function fullMap(){
var qymc=$("#qymc").val();
var fr=$("#fr").val();
var frlxdh=$("#frlxdh").val();
var zs=$("#zs").val();
var qrr=$("#qrr").val();
var qrrlxdh=$("#qrrlxdh").val();
var jd = $("#jd").val();
var wd = $("#wd").val();
window.open(model+"!fullMap.action?jd="+jd+"&wd="+wd+"&qymc="+qymc+"&fr="+fr+"&frlxdh="+frlxdh+"&zs="+zs+"&qrr="+qrr+"&qrrlxdh="+qrrlxdh,"地图标注");
}
/* 2.被window.open子页面调用的父方法 */
function allSelect(jd,wd){
document.getElementById('jd').value=jd;
document.getElementById('wd').value=wd;
var point = new BMap.Point(jd, wd); //创地图对象，设置上已经添加的经纬度
map.centerAndZoom(point,15); // 初始化地图
addMarker(point); //标注初始化经纬度
/* 地图文字标注 */
var opts = {
position : point, // 指定文本标注所在的地理位置
offset : new BMap.Size(-45, -0) //设置文本偏移量
};
var label2 = new BMap.Label("市场主体名称:"+"${dt.qymc}"+"<br/>"+"法定代表人:"+"${dt.fr}"+"<br/>" +"法定代表人联系电话:"+"${dt.frlxdh}"+"<br/>"+"经营地址:"+"${dt.zs}", opts); // 创建文本标注对象
label2.setStyle({
color : "black", //文本字体颜色s
fontSize : "15px" // 文本内字体大小
});
map.enableScrollWheelZoom(true); //滚动条
}
</script>
</html>
全屏页面(相当于用父页面传值给子页面)：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
<head>
<style type="text/css">
/*定义地图容器 */
body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
/* 取消百度地图logo方法 */
.BMap_cpyCtrl
{
display:none;
}
.anchorBL{
display:none;
}
</style>
<!-- 百度地图api -->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=FtppmMikPUX6swgTT3L75eKXX6j1ZsRC"></script>
<!-- 页面布局 -->
<link href="resource/css/rcms_edit.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="resource/css/list.css" media="all" />
<script type="text/javascript" src="resource/js/jquery.js"></script>
<!-- 全屏 -->
<script type="text/javascript">
var model="${MODEL_CODE}";
//window.parent.aa();//调取aa函数
function choosePlace(){
var jd=$('#jd').val();
var wd=$('#wd').val();
window.opener.allSelect(jd,wd); //调用父页面的allsselect方法
window.close();
}
/* 退出全屏 */
function excitfullmap(){
window.close();
}
</script>
</head>
<body>
<div id="noprint" align="center">
<input id="btn" type="button" class="btn" style="border:none;" value="选择" οnclick="choosePlace()" />
<input id="btn" type="button" class="btn" style="border:none;" value="退出全屏" οnclick="excitfullmap()" />
</div>
<div style="width:100%;height:100%;border:2px solid gray" id="allmap"></div>
<input type="hidden" id="jd" name="jd" value="">
<input type="hidden" id="wd" name="wd" value="">
</body>
<script type="text/javascript">
var jd="${jd}";
var wd="${wd}";
/* 从父标签获取标签 */
var initjd=window.opener.jd;
var initwd=window.opener.wd;
if(initjd==null||initjd==''||initjd==undefined){
var map = new BMap.Map("allmap",{enableMapClick:false});
var point = new BMap.Point(jd,wd); //创地图对象，设置上已经添加的经纬度
map.centerAndZoom(point,15); // 初始化地图
map.enableScrollWheelZoom(true); //滚动条
var mk = new BMap.Marker(point);
map.addOverlay(mk);
}else{
var map = new BMap.Map("allmap");
var point = new BMap.Point(jd,wd); //创地图对象，设置上已经添加的经纬度
map.centerAndZoom(point,15); // 初始化地图
map.enableScrollWheelZoom(true); //滚动条
var mk = new BMap.Marker(point);
map.addOverlay(mk);
/* 地图文字标注 */
var opts = {
position : point, // 指定文本标注所在的地理位置
offset : new BMap.Size(-45, -0) //设置文本偏移量
};
var label = new BMap.Label("市场主体名称:"+"${dt.qymc}"+"<br/>"+"法人代表:"+"${fr}"+"<br/>" +"法人联系电话:"+"${frlxdh}"+"<br/>"+"地址:"+"${zs}", opts); // 创建文本标注对象
label.setStyle({
color : "black", //文本字体颜色
fontSize : "15px" // 文本内字体大小
});
map.addOverlay(label);
}
//清除标识
function clearOverlays() {
if (markersArray) {
for (i in markersArray) {
map.removeOverlay(markersArray[i]);
}
}
}
var markersArray = [];
//地图上标注
function addMarker(point) {
var marker = new BMap.Marker(point);
markersArray.push(marker);
clearOverlays();
/* 测试 */
map.removeOverlay(mk);
map.addOverlay(marker);
}
var geoc = new BMap.Geocoder(); // 手动点击位置
map.addEventListener("click", showInfo);
//点击地图时间处理
function showInfo(e) {
document.getElementById('jd').value = e.point.lng; //经度的赋值
document.getElementById('wd').value = e.point.lat; //维度的赋值
geoc.getLocation(e.point, function (rs) {
var addComp = rs.addressComponents;
var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
if (confirm("确认：地址为" + address + "?")) {
}
});
addMarker(e.point);
}
</script>
</html>
我的action方法：
/*电子地图_全屏功能*/
@RequestMapping(value = "/"+MODEL_CODE+"!fullMap.action")
public String fullMap(String jd,String wd,String qymc,String fr,String frlxdh,String zs,String qrr,String qrrlxdh) throws Exception { //
if(StringUtils.isBlank(jd)|| StringUtils.isBlank(wd)){
//后台存储页面数据,向子页面 "dzbt_fullmapPage"输出
String newfr=new String(fr.getBytes("ISO-8859-1"),"utf-8"); // 将页面传来的iso-8859-1数据转为utf-8编码形式
String newqymc=new String(fr.getBytes("ISO-8859-1"),"utf-8");
String newzs=new String(fr.getBytes("ISO-8859-1"),"utf-8");
String newqrr=new String(fr.getBytes("ISO-8859-1"),"utf-8");
setParamToRequest("jd", "112.508074");
setParamToRequest("wd", "23.056833");
setParamToRequest("qymc", newqymc);
setParamToRequest("fr",newfr );
setParamToRequest("frlxdh", frlxdh);
setParamToRequest("zs", newzs);
setParamToRequest("qrr", newqrr);
setParamToRequest("qrrlxdh", qrrlxdh);
setParamToRequest("MODEL_CODE", MODEL_CODE);
return FOLDER+"dzbt_fullmapPage";
}
String newfr=new String(qymc.getBytes("ISO-8859-1"),"utf-8");
String newqymc=new String(fr.getBytes("ISO-8859-1"),"utf-8");
String newzs=new String(fr.getBytes("ISO-8859-1"),"utf-8");
String newqrr=new String(fr.getBytes("ISO-8859-1"),"utf-8");
setParamToRequest("jd", jd);
setParamToRequest("wd", wd);
setParamToRequest("qymc", newqymc);
setParamToRequest("fr",newfr );
setParamToRequest("frlxdh", frlxdh);
setParamToRequest("zs", newzs);
setParamToRequest("qrr", newqrr);
setParamToRequest("qrrlxdh", qrrlxdh);
setParamToRequest("MODEL_CODE", MODEL_CODE);
return FOLDER+"dzbt_fullmapPage";
}
2859
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
