标签:des style http color io os 使用 java ar
/*********测试页面************/
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>天地图测试</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/icon.css">
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://api.tianditu.com/api-new/api/js/maps.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/common_map.js" charset="utf-8"></script>
<script type="text/javascript">
var MAP = null;
$(function(){
MAP = new BaseMap({
mapId : ‘mapDiv‘,
width : 1200,
height: 800,
basePath : ‘${pageContext.request.contextPath}‘,
enableHandleMouseScroll : true,
enableDoubleClickZoom : true,
mapType : 1,
isShowMapTypeBtn : true,
isNavBtn : true,
//导航
isNavigation : true,
//搜索
isSearch : false,
overviewMapCfg : {
anchor: "TMAP_ANCHOR_BOTTOM_RIGHT",
size : new TSize(180,120),
isOpen : true
},
markerPointMsgBoxTitle : ‘停车场‘,
getPointAltText : function(p, marker){
return p[‘name‘];
},
defaultMarkerPoints : [{
lng : 106.50989,
lat : 29.50048,
icon : ‘‘,
name : ‘中国光大银行重庆沙坪坝分行‘,
msgDatas : [‘<b style="font-size:14px;color:#FF0000">中国光大银行重庆沙坪坝分行</b><br/>‘,{
text : ‘名称:‘,
content : ‘名称1111‘
},{
text : ‘地址:‘,
content : ‘地址111111‘
}]
},{
lng : 106.50989,
lat : 30.50048,
icon : ‘‘,
msgDatas : ‘文中还分析了这几年来圈内的“倒星风潮”内幕,称周星驰人品差和忘恩负义只是误读。文中指出,当年洪金宝与周星驰因拍摄《功夫》闹翻系周星驰要求高,频频要求动作导演洪金宝重拍,身为前辈的洪金宝觉得面子上过不去,就离开了剧组。这场纷争最终随着《功夫》的上映,洪金宝拿走了可观分红而告一段落。‘
}],
onMarkerPointAdded : function(point, marker){
console.log(‘marker pointer added‘);
},
polygonMsgBoxTitle : ‘面标注‘,
polygonPointDatas : [[‘<b style="font-size:14px;color:#FF0000">中国光大银行重庆沙坪坝分行</b><br/>‘,{
text : ‘名称:‘,
content : ‘名称1111‘
},{
text : ‘地址:‘,
content : ‘地址111111‘
}]],
defaultPolygonPoints : ‘106.44912,29.52886|106.44053,29.44847|106.63176,29.49569‘,
onPolygonPointsAdded : function(points, polygon){
console.log(‘polygon added‘);
}
});
});
function testAddPoint(){
MAP.addMarkerPoints({
lng : $(‘#lng1‘).val(),
lat : $(‘#lat1‘).val()
},{
centerLng:$(‘#lng1‘).val(),
centerLat:$(‘#lat1‘).val(),
zoom:5,
isClear:false
});
}
function getPolygonDatas(){
alert(MAP.getPolygonToolDrawPointStr());
console.log(MAP.getPolygonToolDrawData());
}
function getMarkerToolData(){
//alert(MAP.getMarkerToolPointData());
console.log(MAP.getMarkerToolPointData());
}
var chooseDialog = null;
function openChooseDialog(){
if(!chooseDialog){
chooseDialog = new BaseMapLngLatChooseDialog({
dialog : {
title : ‘点标注‘,
width : 800,
height: 600
},
map : {
basePath : ‘${pageContext.request.contextPath}‘,
isSearch : true
},
onOkEvent : function(pointData){
alert(pointData.lng + ‘,‘ + pointData.lat);
}
});
}
chooseDialog.show();
}
var chooseAreaDialog = null;
function openChooseAreaDialog(){
if(!chooseAreaDialog){
chooseAreaDialog = new BaseMapAreaChooseDialog({
dialog : {
title : ‘选取区域‘,
width : 1000,
height: 600
},
map : {
basePath : ‘${pageContext.request.contextPath}‘,
isSearch : true
},
onOkEvent : function(pointsData,pointsStr){
alert(pointsStr);
}
});
}
chooseAreaDialog.show();
}
</script>
</head>
<body>
<div id="mapDiv"></div>
<input type="button" value="清除标注点" onclick="MAP.clearMarkerPoints()" />
<input type="text" id="lng1"/> <input type="text" id="lat1" />
<input type="button" value="新增标注点" onclick="testAddPoint()" />
<input type="button" value="开启面标注" onclick="MAP.openPolygonTool()" />
<input type="button" value="获取面标注数据" onclick="getPolygonDatas()" />
<input type="button" value="开启点标注" onclick="MAP.openMarkerTool()" />
<input type="button" value="关闭点标注" onclick="MAP.closeMarkerTool()" />
<input type="button" value="获取点标注数据" onclick="getMarkerToolData()" />
<input type="button" value="弹出选择经纬度" onclick="openChooseDialog()" />
<input type="button" value="区域标注" onclick="openChooseAreaDialog()" />
</body>
</html>
/**************核心JS文件****************/
/***
* 地图基类
*/
var BaseMap = function(config){
if(config == undefined) config = {};
var c = config ;
//基础路径
this.basePath = c.basePath || ‘‘;
//初始化内部默认属性
this._initDefaultProps();
/*****参数及参数解析*******/
//宽度
this.width = c.width || 800;
//高度
this.height = c.height || 600;
//地图面板id
this.mapId = c.mapId || ‘mapDiv‘ ;
//投影方式
this.projection = c.projection || ‘EPSG:4326‘;
//放大级别
this.zoom = c.zoom || 12 ;
//地图中心经度
this.mapCenterLng = c.mapCenterLng || ‘106.50989‘ ;
//地图中心纬度
this.mapCenterLat = c.mapCenterLat || ‘29.50048‘ ;
//是否启用鼠标滚轮放大
this.enableHandleMouseScroll = c.enableHandleMouseScroll || false ;
//是否启用双击放大
this.enableDoubleClickZoom = c.enableDoubleClickZoom || false ;
//默认地图类型(矢量地图1=TMAP_NORMAL_MAP、卫星2=TMAP_SATELLITE_MAP、混合3=TMAP_HYBRID_MAP)
this.mapType = c.mapType || 1 ;
//是否显示地图类型切换按钮
this.isShowMapTypeBtn = (c.isShowMapTypeBtn == undefined) ? true : (c.isShowMapTypeBtn?true:false);
//鹰眼配置(anchor、size、isOpen)
this.overviewMapCfg = c.overviewMapCfg || null;
//是否显示比例尺(默认true)
this.isScale = (c.isScale == undefined) ? true : (c.isScale ? true : false);
//是否显示缩放平移控件(在没有传递isNavBtn的情况下,如果传递了navBtnCfg则未true),默认false
this.isNavBtn = c.isNavBtn == undefined ? ((c.navBtnCfg && true) ? true : false) : (c.isNavBtn ? true : false);
//缩放平移控件配置
this.navBtnCfg = c.navBtnCfg || this.defaultNavBtnCfg;
//默认标注点
this.defaultMarkerPoints = c.defaultMarkerPoints || null ;
//经度key
this.markerPointLngKey = c.markerPointLngKey || ‘lng‘;
//纬度key
this.markerPointLatKey = c.markerPointLatKey || ‘lat‘;
//标注点图标key
this.markerPointIconKey = c.markerPointIconKey || ‘icon‘;
//默认图标
this.markerPointIcon = c.markerPointIcon || this.defaultMarkerPointIcon;
this.markerPointToolIcon = c.markerPointToolIcon || this.defaultMarkerPointToolIcon;
//标注点提示框标题
this.markerPointMsgBoxTitle = c.markerPointMsgBoxTitle || ‘‘;
//面提示框标题
this.polygonMsgBoxTitle = c.polygonMsgBoxTitle || ‘‘;
//面标注参数配置
this.polygonCfg = c.polygonCfg || this.defaultPolygonCfg;
//默认面标注点
this.defaultPolygonPoints = c.defaultPolygonPoints || null ;
//与面标注点(defaultPolygonPoints)对应,要么是一个object(所有面标注共用数据),
//要么是一个数组(与defaultPolygonPoints索引对应数据)
this.polygonPointDatas = c.polygonPointDatas || null;
//是否含有导航功能
this.isNavigation = c.isNavigation || false ;
//是否含有搜索功能
this.isSearch = c.isSearch || false ;
/*******内部数据********/
this.data = {};
//标注点
this.data.markers = [];
//面标注区域
this.data.polygons = [];
//搜索功能区ID
this.data.searchBtnsId = [] ;
//导航功能区ID
this.data.navigationId = [] ;
//面标注工具标注后的数据存储
this.data.polygonToolDrawData = null;
//当前点标注工具标注点的数据存储
this.data.markerToolPointData = null;
/*******方法回调********/
//获取标注点的提示文字
this.getPointAltText = c.getPointAltText || null;
/*******事件处理********/
//当标注点加载后触发,参数:point , marker
this.onMarkerPointAdded = c.onMarkerPointAdded || null;
this.onMarkerPointClick = c.onMarkerPointClick || null;
//如果没有处理标注点单击事件,是否允许默认事件处理
this.isAllowDefaultPointClickHandle = (c.isAllowDefaultClickHandle == undefined) ? true : (c.isAllowDefaultClickHandle?true:false);
//当面标注区域加载后触发,参数:points , polygon
this.onPolygonPointsAdded = c.onPolygonPointsAdded || null;
this.onPolygonPointsClick = c.onPolygonPointsClick || null;
//如果没有处理面单击事件,是否允许默认事件处理
this.isAllowDefaultPolygonClickHandle = (c.isAllowDefaultPolygonClickHandle == undefined) ? true : (c.isAllowDefaultPolygonClickHandle?true:false);
//当面标注完成后触发
this.onDrawPolygonComplete = c.onDrawPolygonComplete || null;
//执行初始化
this.initialize();
};
//初始化内部默认属性
BaseMap.prototype._initDefaultProps = function(){
/*******内部默认属性********/
//比例尺控件对象
this.scale = null;
//缩放平移控件对象
this.navBtnControl = null;
//面标注工具
this.polygonTool = null;
//点标注工具
this.markerTool = null;
//当前点标注工具标注的点
this.currentMarkerPoint = null;
//缩放平移控件默认配置
this.defaultNavBtnCfg = {
//缩放平移的显示类型
type :"TMAP_NAVIGATION_CONTROL_LARGE",
//缩放平移控件显示的位置
anchor :"TMAP_ANCHOR_TOP_LEFT",
//缩放平移控件的偏移值
offset :[0,0],
showZoomInfo : true
};
//默认面标注配置
this.defaultPolygonCfg = {
//边线颜色
strokeColor : ‘#F16C78‘,
//填充颜色。当参数为空时,多边形覆盖物将没有填充效果
fillColor : ‘#F4C3C3‘,
//边线的宽度,以像素为单位
strokeWeight : 4,
//边线透明度,取值范围0 - 1
strokeOpacity : 0.8,
//填充的透明度,取值范围0 - 1
fillOpacity : 0.3,
//边线的样式,solid或dashed
strokeStyle : ‘solid‘,
//是否显示面积,如果不显示面积,则可以作为画面控件使用,默认值为true
showLabel : true
};
//默认标注点图标
this.defaultMarkerPointIcon = this.getIcon(‘marker06‘,72);
//默认标注工具图标
this.defaultMarkerPointToolIcon = this.getIcon(‘marker05‘, 72);
};
/**获取images/markers目录下的图标**/
BaseMap.prototype.getIcon = function(name,size){
if(!size) size = 24;
return new TIcon(this.basePath+‘/images/markers/‘+name+‘_‘+size+‘.png‘,new TSize(size, size));
};
//获取图标
BaseMap.prototype.getIconByUrl = function(url,size){
if(!size){
size = 24;
}
if(url.indexOf(‘http‘) == 0){
return new TIcon(url, new TSize(size, size));
}
return new TIcon(this.basePath + url, new TSize(size, size));
};
//地图初始化
BaseMap.prototype.initialize = function(){
var me = this;
//设置地图大小
$(‘#‘+me.mapId).width(me.width);
$(‘#‘+me.mapId).height(me.height);
//生成导航面板
if(me.isNavigation){
me.showNavigation();
}
//生成搜索面板
if(me.isSearch){
me.showSearchPanel();
}
me.map = new TMap(me.mapId, me.projection);
//设置中心点
me.map.centerAndZoom(new TLngLat(me.mapCenterLng, me.mapCenterLat), me.zoom);
//注册导航事件
if(me.isNavigation){
me.registerNavigation();
}
//注册搜索事件
if(me.isSearch){
me.registerSearch();
}
// 允许中键放大地图
if(me.enableHandleMouseScroll){
me.map.enableHandleMouseScroll();
}
// 允许双击放大地图
if(me.enableDoubleClickZoom){
me.map.enableDoubleClickZoom();
}
// 鹰眼
if(me.overviewMapCfg){
me.map.addControl(new TOverviewMapControl(me.overviewMapCfg));
}
//比例尺
if(me.isScale){
//创建比例尺控件对象
me.scale = new TScaleControl();
//添加比例尺控件
me.map.addControl(me.scale);
}
//缩放平移控件
if(me.isNavBtn){
//创建缩放平移控件对象
me.navBtnControl = new TNavigationControl(me.navBtnCfg);
//添加缩放平移控件
me.map.addControl(me.navBtnControl);
}
// 地图类型
if(me.mapType){
if(me.mapType === 2){
me.map.setMapType(TMAP_SATELLITE_MAP);
}else if(me.mapType === 3){
me.map.setMapType(TMAP_HYBRID_MAP);
}else{
//默认矢量地图
me.map.setMapType(TMAP_NORMAL_MAP);
}
}
//地图类型按钮
if(me.isShowMapTypeBtn){
me.map.addControl(new TMapTypeControl({mapTypes:[TMAP_NORMAL_MAP, TMAP_SATELLITE_MAP, TMAP_HYBRID_MAP]}));
}
//加载默认标注点
if(me.defaultMarkerPoints){
me.addMarkerPoints(me.defaultMarkerPoints, null);
}
//加载默认面标注
if(me.defaultPolygonPoints){
me.addPolygonPoints(me.defaultPolygonPoints, null);
}
};
//生成ID
BaseMap.prototype._genDomID = function(type){
__map_gen_dom_idx++;
return "_basemap_gen_"+ (type || ‘‘) + __map_gen_dom_idx;
};
//清除标注点
BaseMap.prototype.clearMarkerPoints = function(){
var me = this;
if(me.data.markers && me.data.markers.length){
for(var i in me.data.markers){
me.map.removeOverLay(me.data.markers[i]);
}
me.data.markers.length = 0;
}
me.data.markers = [];
};
//添加标注点
//cfg = {centerLng:‘‘,centerLat:‘‘,zoom:12,isClear:false}
//配置包含中心点经纬度,地图放大级别,是否清除已有的标注点
BaseMap.prototype.addMarkerPoints = function(points, cfg){
var me = this;
if(cfg && cfg.isClear){
me.clearMarkerPoints();
}
if(points){
if(!me.data.markers){
me.data.markers = [];
}
if(points.length){
for(var i=0;i<points.length;i++){
var p = points[i];
var marker = new TMarker(new TLngLat(p[me.markerPointLngKey], p[me.markerPointLatKey]));
var markerIcon = me.markerPointIcon;
if(p[me.markerPointIconKey]){
markerIcon = me.getIconByUrl(p[me.markerPointIconKey]);
}
marker.setIcon(markerIcon);
var altText = null;
if(me.getPointAltText){
altText = me.getPointAltText.call(me, p, marker);
}
if(altText){
marker.setTitle(altText);
}
var clickEventHandler = null;
if(me.onMarkerPointClick){
clickEventHandler = me.onMarkerPointClick;
}else if(me.isAllowDefaultPointClickHandle){
clickEventHandler = me.defaultPointClickHandler;
}
if(clickEventHandler){
(function(me,p,marker){
TEvent.addListener(marker,"click",function(){
clickEventHandler.call(me, p, marker, this);
});
})(me,p,marker);
}
me.map.addOverLay(marker);
me.data.markers.push(marker);
if(me.onMarkerPointAdded){
(function(me,p,marker){
me.onMarkerPointAdded.call(me, p, marker);
})(me,p,marker);
}
}
}else{
var p = points;
var marker = new TMarker(new TLngLat(p[me.markerPointLngKey], p[me.markerPointLatKey]));
var markerIcon = me.markerPointIcon;
if(p[me.markerPointIconKey]){
markerIcon = me.getIconByUrl(p[me.markerPointIconKey]);
}
marker.setIcon(markerIcon);
var altText = null;
if(me.getPointAltText){
altText = me.getPointAltText.call(me, p, marker);
}
if(altText){
marker.setTitle(altText);
}
var clickEventHandler = null;
if(me.onMarkerPointClick){
clickEventHandler = me.onMarkerPointClick;
}else if(me.isAllowDefaultPointClickHandle){
clickEventHandler = me.defaultPointClickHandler;
}
if(clickEventHandler){
(function(me,p,marker){
TEvent.addListener(marker,"click",function(){
clickEventHandler.call(me, p, marker, this);
});
})(me,p,marker);
}
me.map.addOverLay(marker);
me.data.markers.push(marker);
if(me.onMarkerPointAdded){
(function(me,p,marker){
me.onMarkerPointAdded.call(me, p, marker);
})(me,p,marker);
}
}
}
//解析配置
if(cfg){
if(cfg.centerLng != undefined && cfg.centerLat != undefined){
me.map.centerAndZoom(new TLngLat(cfg.centerLng, cfg.centerLat), cfg.zoom || me.zoom);
}
}
};
//清除标注点
BaseMap.prototype.clearPolygonPoints = function(){
var me = this;
if(me.data.polygons && me.data.polygons.length){
for(var i in me.data.polygons){
me.map.removeOverLay(me.data.polygons[i]);
}
me.data.polygons.length = 0;
}
me.data.polygons = [];
};
//添加标注面
//polygonPointStrs 一个字符串或字符串数组
//一个字符串代表一个多边形,字符串中包含多个经纬度,多个经纬度组合用竖线(|)分隔,经度、纬度之间用逗号(,)分隔
//cfg = {centerLng:‘‘,centerLat:‘‘,zoom:12,isClear:false}
//配置包含中心点经纬度,地图放大级别,是否清除已有的面标注点
BaseMap.prototype.addPolygonPoints = function(polygonPointStrs, cfg){
var me = this;
if(cfg && cfg.isClear){
me.clearPolygonPoints();
}
if(polygonPointStrs){
var p = null, polygon = null;
if(!me.data.polygons){
me.data.polygons = [];
}
if(typeof polygonPointStrs == ‘string‘){
//单个面标注数据
if(typeof me.polygonPointDatas == ‘string‘){
me._addPolygon(polygonPointStrs, me.polygonPointDatas);
}else if(me.polygonPointDatas && me.polygonPointDatas.length){
me._addPolygon(polygonPointStrs, me.polygonPointDatas[0] || null);
}else{
me._addPolygon(polygonPointStrs, me.polygonPointDatas || null);
}
}else{
//多个面标注数据
for(var i in polygonPointStrs){
if(typeof me.polygonPointDatas == ‘string‘){
me._addPolygon(polygonPointStrs[i], me.polygonPointDatas);
}else if(me.polygonPointDatas && me.polygonPointDatas.length){
me._addPolygon(polygonPointStrs[i], me.polygonPointDatas[i] || null);
}else{
me._addPolygon(polygonPointStrs[i], me.polygonPointDatas || null);
}
}
}
}
//解析配置
if(cfg){
if(cfg.centerLng != undefined && cfg.centerLat != undefined){
me.map.centerAndZoom(new TLngLat(cfg.centerLng, cfg.centerLat), cfg.zoom || me.zoom);
}
}
};
//添加面标注(私有方法)
BaseMap.prototype._addPolygon = function(polygonPointStr, polygonPointData){
var me = this;
var items = polygonPointStr.split("|");
if(items && items.length){
var lngLatStr = null, lngLat = null;
var polygon = null, points = [];
for(var i in items){
lngLatStr = items[i];
if(lngLatStr == null || ‘‘ == lngLatStr){
continue;
}
lngLat = lngLatStr.split(",");
points.push(new TLngLat(lngLat[0],lngLat[1]));
}
//面标注至少3个点
if(points.length >= 3){
polygon = new TPolygon(points, me.polygonCfg);
var clickEventHandler = null;
if(me.onPolygonPointsClick){
clickEventHandler = me.onPolygonPointsClick;
}else if(me.isAllowDefaultPolygonClickHandle){
clickEventHandler = me.defaultPolygonClickHandler;
}
if(clickEventHandler){
(function(me, points, polygonPointData, polygon){
TEvent.addListener(polygon,"click",function(eventPixel){
clickEventHandler.call(me, points, polygonPointData, polygon, eventPixel, this);
});
})(me, points, polygonPointData, polygon);
}
me.map.addOverLay(polygon);
me.data.polygons.push(polygon);
if(me.onPolygonPointsAdded){
(function(me, points, polygonPointData, polygon){
me.onPolygonPointsAdded.call(me, points, polygonPointData, polygon);
})(me, points, polygonPointData, polygon);
}
}
}
};
//标注点单击事件默认处理方法,弹出提示框
BaseMap.prototype.defaultPointClickHandler = function(point, marker, event){
var me = this;
var config = {
offset:new TPixel(-125, 90),
position: new TLngLat(marker.getLngLat().lng,marker.getLngLat().lat)
};
me.showMsgBox((me.markerPointMsgBoxTitle || ‘‘), point && point.msgDatas, config, 320, 155);
};
//面单击事件默认处理方法,弹出提示框
BaseMap.prototype.defaultPolygonClickHandler = function(points, polygonPointData, polygon, pixel, event){
var me = this;
var bounds = polygon.getBounds();
var center = bounds.getCenter();
var config = {
offset: new TPixel(-130, 20),
//position: new TLngLat(points[0].getLng(), points[0].getLat())
position : new TLngLat(center.getLng(),center.getLat())
};
me.showMsgBox((me.polygonMsgBoxTitle || ‘‘), polygonPointData, config, 320, 155);
};
//弹出提示
BaseMap.prototype.showMsgBox = function(title,msgDatas,cfg,width,height){
var me = this;
var contentWidth = width - 20;
if(contentWidth < 220){
contentWidth = 220;
}
var contentHeight = height - 55;
if(contentHeight < 50){
contentHeight = 50;
}
var html = [];
var msgLabelId = me._genDomID(‘alt_msg_label‘);
html.push(‘<div id="‘+msgLabelId+‘" style="width:‘+width+‘px;">‘);
html.push(‘<div style="margin:4px 10px 3px 10px;height:18px;"><b><span style="color:#333333;font-size:14px;">‘
+ (title || ‘‘) + ‘</span><span style="float:right;width:12px;height:12px;background:url(\‘‘
+ me.basePath+‘/images/btn_close.jpg\‘) no-repeat 0px 0px;cursor:pointer;" title="关闭" class="close_btn"></span></b></div>‘);
html.push(‘<hr style="height: 2px;padding:0px;margin:0px 3px; background-color: #484848;">‘);
html.push(‘<div style="margin:10px;height:‘+contentHeight+‘px;overflow:auto;">‘);
html.push(‘<table width="‘+contentWidth+‘" border="0" style="font-size:12px;">‘);
if(typeof msgDatas == ‘string‘){
html.push(‘<tr><td align="left">‘+msgDatas+‘</td></tr>‘);
}else{
if(msgDatas && msgDatas.length){
for(var i in msgDatas){
if(typeof msgDatas[i] == ‘string‘){
html.push(‘<tr><td align="left" colspan="2">‘+msgDatas[i]+‘</td></tr>‘);
}else{
html.push(‘<tr><td class="key" width="60" align="left" style="font-weight:bold;">‘ + (msgDatas[i][‘text‘] || ‘‘));
html.push(‘</td><td class="value" align="left">‘+(msgDatas[i][‘content‘] || ‘‘)+‘</td></tr>‘);
}
}
}
}
html.push(‘</table>‘);
html.push(‘</div>‘);
html.push(‘</div>‘);
var altMsgLabel =new TLabel(cfg);
altMsgLabel.setTitle(title || ‘‘);
altMsgLabel.setLabel(html.join(‘‘));
altMsgLabel.setBorderColor(‘#B3B3B3‘);
me.map.addOverLay(altMsgLabel);
//绑定关闭图层事件
$(‘#‘+msgLabelId+‘ .close_btn‘).delegate(‘‘,‘click‘,function(){
me.map.removeOverLay(altMsgLabel);
});
};
//开启面标注工具
BaseMap.prototype.openPolygonTool = function(polygonCfg){
var me = this;
if(!me.map){
return;
}
if(!me.polygonTool){
//清除数据
me.data.polygonToolDrawData = null;
me.polygonTool = new TPolygonTool(me.map, polygonCfg || me.polygonCfg);
//注册测面工具绘制完成后的事件
//参数说明:
//points:用户最后绘制的折线的点坐标数组。
//length:用户最后绘制的折线的地理长度。
//polyline:当前测距所画线的对象。
TEvent.addListener(this.polygonTool,"draw", function(points, length, polyline){
//数据存储
me.data.polygonToolDrawData = {
//坐标点数组
‘points‘ : points,
//总面积(单位:平方米)
‘area‘ : length,
//坐标点总距离
‘totalDistance‘ : me.polygonTool.getDistance(points)
};
//关闭面标注工具
me.closePolygonTool();
//回调事件
if(me.onDrawPolygonComplete){
me.onDrawPolygonComplete.call(me, points, length, polyline, this);
}
});
}
me.polygonTool.open();
};
//关闭面标注工具
BaseMap.prototype.closePolygonTool = function(){
var me = this;
if(me.polygonTool){
me.polygonTool.close();
}
};
//获取面标注数据
BaseMap.prototype.getPolygonToolDrawData = function(){
return this.data.polygonToolDrawData;
};
//获取面标注坐标串
BaseMap.prototype.getPolygonToolDrawPointStr= function(){
if(this.data.polygonToolDrawData){
var points = this.data.polygonToolDrawData.points;
var pointStrArr = [];
if(points && points.length){
for(var i in points){
pointStrArr.push(points[i].getLng() + ‘,‘ + points[i].getLat());
}
}
if(pointStrArr.length){
return pointStrArr.join(‘|‘);
}
}
return ‘‘;
};
//开启点标注工具
BaseMap.prototype.openMarkerTool = function(markerIcon){
var me = this;
if(!me.map){
return;
}
if(!me.markerTool){
me.data.markerToolPointData = null;
me.markerTool = new TMarkTool(me.map);
//注册标注的mouseup事件
TEvent.addListener(me.markerTool,"mouseup",function(point){
me.data.markerToolPointData = {
‘lng‘ : point.getLng(),
‘lat‘ : point.getLat()
};
me.currentMarkerPoint = new TMarker(point);
me.currentMarkerPoint.setTitle(‘经纬度:‘+point.getLng()+‘,‘+point.getLat());
if(markerIcon){
me.currentMarkerPoint.setIcon(markerIcon);
}else{
me.currentMarkerPoint.setIcon(me.markerPointToolIcon);
}
me.map.addOverLay(me.currentMarkerPoint);
me.currentMarkerPoint.enableEdit();
TEvent.bind(me.currentMarkerPoint,"dragend", me.currentMarkerPoint, function(lngLat){
me.data.markerToolPointData = {
‘lng‘ : lngLat.getLng(),
‘lat‘ : lngLat.getLat()
};
me.currentMarkerPoint.setTitle(‘经纬度:‘ + lngLat.getLng()+‘,‘ + lngLat.getLat());
});
me.markerTool.close();
});
me.markerTool.open();
}else{
if(this.currentMarkerPoint){
this.currentMarkerPoint.enableEdit();
}
}
};
//关闭点标注
BaseMap.prototype.closeMarkerTool = function(markerCfg){
if(this.currentMarkerPoint){
this.currentMarkerPoint.disableEdit();
}
}
//获取点标注数据
BaseMap.prototype.getMarkerToolPointData = function(){
return this.data.markerToolPointData;
};
/********************************************************************导航函数************************************************************/
//生成导航面板
BaseMap.prototype.showNavigation = function(){
var me = this ;
me.data.navigationId.starBtnId = me._genDomID(‘starBtn‘) ;
me.data.navigationId.endBtnId = me._genDomID(‘endBtn‘) ;
me.data.navigationId.searchBtnId = me._genDomID(‘searchBtnId‘) ;
me.data.navigationId.resultDiv = me._genDomID(‘resultDivNavigation‘) ;
me.data.navigationId.start = me._genDomID(‘start‘) ;
me.data.navigationId.end = me._genDomID(‘end‘) ;
me.data.navigationId.endTips = me._genDomID(‘endTips‘) ;
var searchDivId = me._genDomID(‘searchDiv‘) ;
var html = ‘‘ ;
html +=‘<div id=‘+searchDivId+‘ style="background-color: RGB(237,244,255);height=500px;">‘;
html +=‘<div style="font-size:13px; border:1px solid #999999; line-height:27px; padding-left:7px">‘;
html +=‘<input type="radio" name="planType" value="0" checked="checked"/>最少时间‘;
html +=‘<input type="radio" name="planType" value="1"/>最短距离‘;
html +=‘<input type="radio" name="planType" value="2"/>避开高速‘;
html +=‘<input type="radio" name="planType" value="3"/>步行‘;
html +=‘<br/>‘;
html +=‘起点:<input type="text" id="‘+me.data.navigationId.start+‘" value="" readonly="readonly"/>‘;
html +=‘<input type="button" value="选择起点" id="‘+me.data.navigationId.starBtnId+‘" />‘;
html +=‘<br/>‘;
html +=‘终点:<input type="text" id="‘+me.data.navigationId.endTips+‘" value="" readonly="readonly"/>‘;
html +=‘<input type="hidden" id="‘+me.data.navigationId.end+‘" value=""/>‘;
html +=‘<input type="button" id=‘+me.data.navigationId.endBtnId+‘ value="终点"/>‘;
html +=‘<br/>‘;
html +=‘<input type="button" id=‘+me.data.navigationId.searchBtnId+‘ value="驾车路线搜索"/>‘;
html +=‘</div>‘;
html +=‘<br/>‘;
html +=‘<div id="‘+me.data.navigationId.resultDiv+‘" style=" width:300px; overflow-y:scroll; border: solid 1px gray;"></div>‘;
html +=‘</div>‘;
var navigationPanelWidth = 310;
var mapWidth = me.width - navigationPanelWidth - 20;
me.containerId = me.mapId;
me.mapId = me._genDomID(‘mapDiv‘);
var navigationPanelId = me._genDomID(‘navigationPanel‘);
var mapContainerDom = $(‘#‘+me.containerId);
mapContainerDom.css(‘width‘,me.width);
mapContainerDom.css(‘height‘,me.height);
mapContainerDom.layout();
mapContainerDom.layout(‘add‘,{
region: ‘west‘,
width: navigationPanelWidth,
height: me.height,
style : {
zIndex : 100
},
title: ‘导航‘,
content : ‘<div id="‘+navigationPanelId+‘"></div>‘,
split: true,
onCollapse: function(){
me.map.checkResize();
},
onExpand : function(){
me.map.checkResize();
}
});
$(‘#‘+navigationPanelId).append($(html));
mapContainerDom.layout(‘add‘,{
region: ‘center‘,
style : {
zIndex : 98
},
content : ‘<div id="‘+me.mapId+‘" style="width:100%;height:100%;"></div>‘
});
$(‘#‘+searchDivId).height((me.height-30));
};
//定位关键点
BaseMap.prototype.showNavigationPosition = function (lng,lat,des) {
var me = this ;
if(me.infoWin) {
me.map.removeOverLay(me.infoWin);
me.infoWin = null;
}
var lnglat = new TLngLat(lng,lat);
me.infoWin=new TInfoWindow(lnglat,new TPixel([0,0]));
me.infoWin.setLabel(des);
me.map.addOverLay(me.infoWin);
//打开信息窗口时地图自动平移
me.infoWin.enableAutoPan();
}
//注册导航功能
BaseMap.prototype.registerNavigation = function(){
var me = this ;
me.startIcon = me.basePath+‘/images/start.png‘ ;
me.endIcon = me.basePath+‘/images/end.png‘ ;
var configCar = {
policy:0,
onSearchComplete:function(result){
//添加起始点
var icon = new TIcon(me.startIcon,new TSize(24,24),{anchor:new TPixel(12,12)})
var startMarker = new TMarker(me.startLngLat,{icon:icon});
me.map.addOverLay(startMarker);
//向地图上添加终点
var icon = new TIcon(me.endIcon,new TSize(24,24),{anchor:new TPixel(12,12)})
var endMarker = new TMarker(me.endLngLat,{icon:icon});
me.map.addOverLay(endMarker);
me.obj = result;
var resultList = document.createElement("div");
//获取方案个数
var routes = result.getNumPlans();
for(var i=0;i<routes;i++) {
//获得单条驾车方案结果对象
var plan = result.getPlan(i);
//显示单个方案面板
var div = document.createElement("div");
div.style.cssText = "font-size:12px; cursor:pointer; border:1px solid #999999";
//显示方案内容
var describeStr = "<strong>总时间:"+plan.getDuration()+"秒,总距离:"+Math.round(plan.getDistance())+"公里</strong>";
describeStr += "<div><img src=‘"+me.startIcon+"‘/>"+$(‘#‘+me.data.navigationId.start).val()+"</div>";
//显示该方案每段的描述信息
var numRoutes = plan.getNumRoutes();
for(var m=0;m<numRoutes;m++) {
var route = plan.getRoute(m);
describeStr += (m+1)+".<span>"+route.getDescription()+"</span><br/>"
//显示该方案每段的详细描述信息
var numStepsStr = "";
var numSteps = route.getNumSteps();
for(var n=0;n<numSteps;n++) {
var step = route.getStep(n);
var showPositionId = me._genDomID(‘position‘) ;
numStepsStr += "<p>"+(n+1)+")<a href=‘#‘ id=‘"+showPositionId+"‘ >"+step.getDescription()+"</a></p>";
(function(step){
$(‘#‘+showPositionId).delegate(‘‘,‘click‘,function(){
me.showNavigationPosition(step.getPosition().getLng(),step.getPosition().getLat(),step.getDescription());
});
})(step);
}
describeStr += numStepsStr;
}
describeStr += "<div><img src=‘"+me.endIcon+"‘/>"+$(‘#‘+me.data.navigationId.end).val()+"</div>";
div.innerHTML = describeStr;
resultList.appendChild(div);
//显示驾车线路
var line = new TPolyline(plan.getPath(),{strokeColor:"red", strokeWeight:5, strokeOpacity:0.9});
me.map.addOverLay(line);
//显示最佳级别
me.map.setViewport(plan.getPath());
}
//显示公交搜索结果
$(‘#‘+me.data.navigationId.resultDiv).append(resultList);
}
};
me.drivingRoute = new TDrivingRoute(me.map,configCar);
var config = {
icon : new TIcon(me.startIcon,new TSize(24,24),{anchor:new TPixel(14,28)})
};
me.startTool = new TMarkTool(me.map,config);
TEvent.addListener(me.startTool,"mouseup",function(point){
var icon = new TIcon(me.startIcon,new TSize(24,24),{anchor:new TPixel(14,28)})
var startMarker = new TMarker(point,{icon:icon});
me.map.addOverLay(startMarker);
me.startTool.close();
$(‘#‘+me.data.navigationId.start).val(point.getLng()+","+point.getLat());
});
var config = {
icon : new TIcon(me.endIcon,new TSize(24,24),{anchor:new TPixel(14,28)})
};
me.endTool = new TMarkTool(me.map,config);
TEvent.addListener(me.endTool,"mouseup",function(point){
var icon = new TIcon(me.endIcon,new TSize(24,24),{anchor:new TPixel(14,28)})
var endMarker = new TMarker(point,{icon:icon});
me.map.addOverLay(endMarker);
me.endTool.close();
$(‘#‘+me.data.navigationId.end).val(point.getLng()+","+point.getLat());
$(‘#‘+me.data.navigationId.endTips).val(point.getLng()+","+point.getLat());
});
// 设置终点的值
//TODO
// $("#end").val(tempLng+","+tempLat);
// $("#endTips").val(name);
// 给开始结束按钮绑定事件
$(‘#‘+me.data.navigationId.starBtnId).bind(‘click‘,function(){
me.startTool.open();
});
$(‘#‘+me.data.navigationId.endBtnId).bind(‘click‘,function(){
me.endTool.open();
});
$(‘#‘+me.data.navigationId.searchBtnId).bind(‘click‘,function(){
$(‘#‘+me.data.navigationId.resultDiv).html(‘‘);
me.map.clearOverLays();
var startVal = $(‘#‘+me.data.navigationId.start).val().split(",");
me.startLngLat = new TLngLat(startVal[0],startVal[1]);
var endVal = $(‘#‘+me.data.navigationId.end).val().split(",");
me.endLngLat = new TLngLat(endVal[0],endVal[1]);
me.drivingRoute.setPolicy(getNavigationRadioValue());
me.drivingRoute.search(me.startLngLat,me.endLngLat);
});
}
//获得驾车路线策略
function getNavigationRadioValue() {
var obj = $(‘input[name=planType]‘);
for(var i=0;i<obj.length;i++) {
if(obj[i].checked) {
return obj[i].value;
}
}
}
/********************************************************************导航函数end************************************************************/
/********************************************************************搜索函数************************************************************/
BaseMap.prototype.localSearchResult = function(result){
this.clearAllSearchContent();
this.promptSearch(result);
switch(parseInt(result.getResultType())){
case 1:
this.poisSearch(result.getPois());
break;
case 2:
this.statisticsSearch(result.getStatistics());
break;
case 3:
this.areaSearch(result.getArea());
break;
case 4:
this.suggestsSearch(result.getSuggests());
break;
case 5:
this.lineDataSearch(result.getLineData());
break;
}
}
BaseMap.prototype.registerSearch = function(){
var me = this ;
var config = {
pageCapacity:17, //每页显示的数量
//接收数据的回调函数
onSearchComplete: function(){
me.localSearchResult.apply(me,arguments);
}
}
me.localsearch = new TLocalSearch(me.map,config);
$(‘#‘+me.data.searchBtnsId.searchBtn).bind(‘click‘,function(){
me.localsearch.search($(‘#‘+me.data.searchBtnsId.keyWord).val());
$(‘#‘+me.data.searchBtnsId.pageDiv).show();
});
}
BaseMap.prototype.clearAllSearchContent = function(){
this.map.clearOverLays();
$(‘#‘+this.data.searchBtnsId.searchDiv).html(‘‘);
$(‘#‘+this.data.searchBtnsId.resultDiv).css(‘display‘,‘none‘);
$(‘#‘+this.data.searchBtnsId.statisticsDiv).html(‘‘);
$(‘#‘+this.data.searchBtnsId.statisticsDiv).css(‘display‘,‘none‘);
$(‘#‘+this.data.searchBtnsId.promptDiv).html(‘‘);
$(‘#‘+this.data.searchBtnsId.promptDiv).css(‘display‘,‘none‘);
$(‘#‘+this.data.searchBtnsId.suggestsDiv).html(‘‘);
$(‘#‘+this.data.searchBtnsId.suggestsDiv).css(‘display‘,‘none‘);
$(‘#‘+this.data.searchBtnsId.lineDataDiv).html(‘‘);
$(‘#‘+this.data.searchBtnsId.lineDataDiv).css(‘display‘,‘none‘);
marker = new TMarker(new TLngLat(this.mapCenterLng, this.mapCenterLat));
this.map.addOverLay(marker);
marker.enableEdit();
listener=TEvent.bind(marker,"dragend", marker, this.dragendSearch);
}
BaseMap.prototype.promptSearch = function(obj){
var prompts = obj.getPrompt();
if(prompts) {
var promptHtml = "";
for(var i=0;i<prompts.length;i++) {
var prompt = prompts[i];
var promptType = prompt.type;
var promptAdmins = prompt.admins;
var meanprompt = prompt.DidYouMean;
if(promptType == 1) {
promptHtml += "<p>您是否要在"+promptAdmins[0].name+"</strong>搜索更多包含<strong>"+obj.getKeyword()+"</strong>的相关内容?<p>";
} else if(promptType == 2) {
promptHtml += "<p>在<strong>"+promptAdmins[0].name+"</strong>没有搜索到与<strong>"+obj.getKeyword()+"</strong>相关的结果。<p>";
if(meanprompt){
promptHtml += "<p>您是否要找:<font weight=‘bold‘ color=‘#035fbe‘><strong>"+meanprompt+"</strong></font><p>";
}
} else if(promptType == 3) {
promptHtml += "<p style=‘margin-bottom:3px;‘>有以下相关结果,您是否要找:</p>"
for(i=0;i<promptAdmins.length;i++) {
promptHtml += "<p>"+promptAdmins[i].name+"</p>";
}
}
}
if(promptHtml != "") {
$(‘#‘+this.data.searchBtnsId.promptDiv).css(‘display‘,‘block‘);
$(‘#‘+this.data.searchBtnsId.promptDiv).html(promptHtml);
}
}
}
//解析点数据结果
BaseMap.prototype.poisSearch = function(obj){
var me = this ;
if(obj) {
//显示搜索列表
var divMarker = document.createElement("div");
//坐标数组,设置最佳比例尺时会用到
var zoomArr = [];
for(var i=0;i<obj.length;i++) {
//闭包
(function(i){
//名称
var name = obj[i].name;
//地址
var address = obj[i].address;
//坐标
var lnglatArr = obj[i].lonlat.split(" ");
var lnglat = new TLngLat(lnglatArr[0],lnglatArr[1]);
var winHtml = "地址:"+address;
//创建标注对象
var marker = new TMarker(lnglat);
//地图上添加标注点
me.map.addOverLay(marker);
//注册标注点的点击事件
TEvent.bind(marker,"click",marker,function(){
var info = this.openInfoWinHtml(winHtml);
info.setTitle(name);
});
zoomArr.push(lnglat);
//在页面上显示搜索的列表
var a = document.createElement("a");
a.href = "javascript://";
a.innerHTML = name;
a.onclick = function(){
me.showPositionSearch(marker,name,winHtml);
}
divMarker.appendChild(document.createTextNode((i+1)+"."));
divMarker.appendChild(a);
divMarker.appendChild(document.createElement("br"));
})(i);
}
//显示地图的最佳级别
me.map.setViewport(zoomArr);
//显示搜索结果
divMarker.appendChild(document.createTextNode(‘共‘+me.localsearch.getCountNumber()+‘条记录,分‘+me.localsearch.getCountPage()+‘页,当前第‘+me.localsearch.getPageIndex()+‘页‘));
$(‘#‘+this.data.searchBtnsId.searchDiv).append(divMarker);
$(‘#‘+this.data.searchBtnsId.resultDiv).css(‘display‘,‘block‘);
}
}
//显示信息框
BaseMap.prototype.showPositionSearch = function(marker,name,winHtml){
var info = marker.openInfoWinHtml(winHtml);
info.setTitle(name);
}
//解析推荐城市
BaseMap.prototype.statisticsSearch = function(obj){
if(obj) {
//坐标数组,设置最佳比例尺时会用到
var pointsArr = [];
var priorityCitysHtml = "";
var allAdminsHtml = "";
var priorityCitys = obj.priorityCitys;
if(priorityCitys) {
//推荐城市显示
priorityCitysHtml += "在中国以下城市有结果<ul>";
for(var i=0;i<priorityCitys.length;i++) {
priorityCitysHtml += "<li>" + priorityCitys[i].name + "("+priorityCitys[i].count+")</li>";
}
priorityCitysHtml += "</ul>";
}
var allAdmins = obj.allAdmins;
if(allAdmins) {
allAdminsHtml += "更多城市<ul>";
for(var i=0;i<allAdmins.length;i++) {
allAdminsHtml += "<li>" + allAdmins[i].name + "("+allAdmins[i].count+")";
var childAdmins = allAdmins[i].childAdmins;
if(childAdmins) {
for(var m=0;m<childAdmins.length;m++) {
allAdminsHtml += "<blockquote>" + childAdmins[m].name + "("+childAdmins[m].count+")</blockquote>";
}
}
allAdminsHtml += "</li>"
}
allAdminsHtml += "</ul>";
}
document.getElementById("statisticsDiv").style.display = "block";
document.getElementById("statisticsDiv").innerHTML = priorityCitysHtml + allAdminsHtml;
$(‘#‘+this.data.searchBtnsId.statisticsDiv).css(‘display‘,‘block‘);
$(‘#‘+this.data.searchBtnsId.statisticsDiv).html(priorityCitysHtml + allAdminsHtml);
}
}
//解析行政区划边界
BaseMap.prototype.areaSearch = function(obj){
if(obj) {
//坐标数组,设置最佳比例尺时会用到
var pointsArr = [];
var points = obj.points;
for(var i=0;i<points.length;i++) {
var regionLngLats = [];
var regionArr = points[i].region.split(",");
for(var m=0;m<regionArr.length;m++) {
var lnglatArr = regionArr[m].split(" ");
var lnglat = new TLngLat(lnglatArr[0],lnglatArr[1]);
regionLngLats.push(lnglat);
pointsArr.push(lnglat);
}
//创建线对象
var line = new TPolyline(regionLngLats,{strokeColor:"blue", strokeWeight:3, strokeOpacity:1, strokeStyle:"dashed"});
//向地图上添加线
this.map.addOverLay(line);
}
//显示最佳比例尺
this.map.setViewport(pointsArr);
}
}
//解析建议词信息
BaseMap.prototype.suggestsSearch = function(obj){
if(obj) {
//建议词提示,如果搜索类型为公交规划建议词或公交站搜索时,返回结果为公交信息的建议词。
var suggestsHtml = "建议词提示<ul>";
for(var i=0;i<obj.length;i++) {
suggestsHtml += "<li>" + obj[i].name + " <font style=‘color:#666666‘>"+obj[i].address+"</font></li>";
}
$(‘#‘+this.data.searchBtnsId.suggestsDiv).css(‘display‘,‘block‘);
$(‘#‘+this.data.searchBtnsId.suggestsDiv).html(suggestsHtml);
}
}
//解析公交信息
BaseMap.prototype.lineDataSearch = function(obj){
if(obj) {
//公交提示
var lineDataHtml = "公交提示<ul>";
for(var i=0;i<obj.length;i++) {
lineDataHtml += "<li>" + obj[i].name + " <font style=‘color:#666666‘>共"+obj[i].stationNum+"站</font></li>";
}
lineDataHtml += "</ul>";
$(‘#‘+this.data.searchBtnsId.lineDataDiv).css(‘display‘,‘block‘);
$(‘#‘+this.data.searchBtnsId.lineDataDiv).html(lineDataHtml);
}
}
BaseMap.prototype.dragendSearch = function(lnglat){
this.map.removeOverLay(infoWin);
var nowLng = lnglat.getLng();
var nowLat = lnglat.getLat();
var config={
text:"经度:"+nowLng+"</br>纬度:"+nowLat,
offset:new TPixel(-45,-50),
position:lnglat};
infoWin=new TLabel(config);
this.map.addOverLay(infoWin);
}
BaseMap.prototype.showSearchPanel = function(){
var me = this ;
me.data.searchBtnsId.searchBtn = me._genDomID(‘searchBtn‘) ;
me.data.searchBtnsId.promptDiv = me._genDomID(‘promptDiv‘) ;
me.data.searchBtnsId.statisticsDiv = me._genDomID(‘statisticsDiv‘) ;
me.data.searchBtnsId.suggestsDiv = me._genDomID(‘suggestsDiv‘) ;
me.data.searchBtnsId.lineDataDiv = me._genDomID(‘lineDataDiv‘) ;
me.data.searchBtnsId.resultDiv = me._genDomID(‘resultDiv‘) ;
me.data.searchBtnsId.searchDiv = me._genDomID(‘searchDiv‘) ;
me.data.searchBtnsId.pageDiv = me._genDomID(‘pageDiv‘) ;
me.data.searchBtnsId.first_page = me._genDomID(‘first_page‘) ;
me.data.searchBtnsId.up_page = me._genDomID(‘up_page‘) ;
me.data.searchBtnsId.next_page = me._genDomID(‘next_page‘) ;
me.data.searchBtnsId.end_page = me._genDomID(‘end_page‘) ;
me.data.searchBtnsId.turn_page = me._genDomID(‘turn_page‘) ;
me.data.searchBtnsId.hide_page = me._genDomID(‘hide_page‘) ;
me.data.searchBtnsId.pageId = me._genDomID(‘pageId‘) ;
me.data.searchBtnsId.keyWord = me._genDomID(‘keyWord‘) ;
var searchDivId = me._genDomID(‘searchDiv‘) ;
var html = ‘‘ ;
html +=‘<div id=‘+searchDivId+‘ style="background-color: RGB(237,244,255);height=500px;">‘;
html +=‘<div style="font-size:13px; border:1px solid #999999; line-height:27px; padding-left:7px">‘;
html +=‘搜索内容:<input type="text" id="‘+me.data.searchBtnsId.keyWord+‘"/>‘;
html +=‘<input type="button" id="‘+me.data.searchBtnsId.searchBtn+‘" value="搜索"/>‘;
html +=‘</div>‘;
html +=‘<br/>‘;
html +=‘<div id="‘+me.data.searchBtnsId.promptDiv+‘" class="prompt"></div>‘;
html +=‘<div id="‘+me.data.searchBtnsId.statisticsDiv+‘" class="statistics"></div>‘;
html +=‘<div id="‘+me.data.searchBtnsId.suggestsDiv+‘" class="suggests"></div>‘;
html +=‘<div id="‘+me.data.searchBtnsId.lineDataDiv+‘" class="lineData"></div>‘;
html +=‘<div id="‘+me.data.searchBtnsId.resultDiv+‘" class="result">‘;
html +=‘<div id="‘+me.data.searchBtnsId.searchDiv+‘"></div>‘;
html +=‘<div id="‘+me.data.searchBtnsId.pageDiv+‘">‘;
html +=‘<input type="button" value="第一页" id="‘+me.data.searchBtnsId.first_page+‘" />‘;
html +=‘<input type="button" value="上一页" id="‘+me.data.searchBtnsId.up_page+‘" />‘;
html +=‘<input type="button" value="下一页" id="‘+me.data.searchBtnsId.next_page+‘" />‘;
html +=‘<input type="button" value="最后一页" id="‘+me.data.searchBtnsId.end_page+‘" />‘;
html +=‘<br/>‘;
html +=‘转到第<input type="text" value="1" id="‘+me.data.searchBtnsId.pageId+‘" size="3"/>页‘;
html +=‘<input type="button" id="‘+me.data.searchBtnsId.turn_page+‘" value="转到"/>‘;
html +=‘<input type="button" id="‘+me.data.searchBtnsId.hide_page+‘" value="收起"/>‘;
html +=‘</div>‘;
html +=‘</div>‘;
html +=‘</div>‘;
var navigationPanelWidth = 310;
var mapWidth = me.width - navigationPanelWidth - 20;
me.containerId = me.mapId;
me.mapId = me._genDomID(‘mapDiv‘);
var navigationPanelId = me._genDomID(‘navigationPanel‘);
var mapContainerDom = $(‘#‘+me.containerId);
mapContainerDom.css(‘width‘,me.width);
mapContainerDom.css(‘height‘,me.height);
mapContainerDom.layout();
mapContainerDom.layout(‘add‘,{
region: ‘west‘,
width: navigationPanelWidth,
height: me.height,
style : {
zIndex : 100
},
title: ‘搜索‘,
content : ‘<div id="‘+navigationPanelId+‘"></div>‘,
split: true,
onCollapse: function(){
me.map.checkResize();
},
onExpand : function(){
me.map.checkResize();
}
});
$(‘#‘+navigationPanelId).append($(html));
mapContainerDom.layout(‘add‘,{
region: ‘center‘,
style : {
zIndex : 98
},
content : ‘<div id="‘+me.mapId+‘" style="width:100%;height:100%;"></div>‘
});
$(‘#‘+searchDivId).height((me.height-30));
//绑定事件
$(‘#‘+me.data.searchBtnsId.first_page).bind(‘click‘,function(){
me.localsearch.firstPage();
});
$(‘#‘+me.data.searchBtnsId.up_page).bind(‘click‘,function(){
me.localsearch.previousPage();
});
$(‘#‘+me.data.searchBtnsId.next_page).bind(‘click‘,function(){
me.localsearch.nextPage();
});
$(‘#‘+me.data.searchBtnsId.end_page).bind(‘click‘,function(){
me.localsearch.lastPage();
});
$(‘#‘+me.data.searchBtnsId.turn_page).bind(‘click‘,function(){
me.localsearch.gotoPage(parseInt($(‘#‘+me.data.searchBtnsId.pageId).val()));
});
$(‘#‘+me.data.searchBtnsId.hide_page).bind(‘click‘,function(){
me.clearAllSearchContent();
});
$(‘#‘+me.data.searchBtnsId.pageDiv).hide();
}
/********************************************************************搜索函数end************************************************************/
/*********************选取经纬度Dialog*************************/
var BaseMapLngLatChooseDialog = function(init_params){
var p = init_params,me = this;
me.dialogId = me._genDomID(‘dialog‘);
me.mapDivId = me._genDomID(‘mapdiv‘);
me.onOkEvent = p.onOkEvent || null;
me.dialogDom = $(‘<div id="‘+ me.dialogId +‘"></div>‘);
$(document.body).append(me.dialogDom);
var dialogParams = p[‘dialog‘] || {};
if(dialogParams.closed == undefined){
dialogParams.closed = true;//dialog默认关闭
}
dialogParams.width = dialogParams.width || 600;
dialogParams.height = dialogParams.height || 440;
dialogParams.modal = true;
dialogParams.title = dialogParams.title || ‘标注点‘;
dialogParams.content = ‘<div id="‘+me.mapDivId+‘" style="width:800px;height:600px;"></div>‘;
dialogParams.buttons = [{
text : ‘确定‘,
iconCls : ‘icon-ok‘,
handler : function(){
var point = me.map.getMarkerToolPointData();
if(me.onOkEvent){
me.onOkEvent.call(me, point);
}
me.close();
}
},{
text : ‘关闭‘,
iconCls : ‘icon-cancel‘,
handler : function(){
me.close();
}
}];
me.dialogDom.dialog(dialogParams);
me.map = null;
me.mapParams = p[‘map‘] || {};
me.mapParams.mapId = me.mapDivId;
me.mapParams.width = dialogParams.width-31;
me.mapParams.height = dialogParams.height-75;
};
//显示
BaseMapLngLatChooseDialog.prototype.show = function(){
if(this.dialogDom){
this.dialogDom.dialog(‘open‘);
if(!this.map){
this.map = new BaseMap(this.mapParams);
this.map.openMarkerTool();
}
}
};
//关闭
BaseMapLngLatChooseDialog.prototype.close = function(){
if(this.dialogDom){
this.dialogDom.dialog(‘close‘);
}
};
//关闭
BaseMapLngLatChooseDialog.prototype.setTitle = function(title){
if(this.dialogDom){
this.dialogDom.dialog(‘setTitle‘, title || ‘‘);
}
};
//ID生成
BaseMapLngLatChooseDialog.prototype._genDomID = function(type){
__map_gen_dom_idx++;
return "_basemap_lnglat_choosedialog_gen_"+ (type || ‘‘) + __map_gen_dom_idx;
};
/*********************选取区域Dialog*************************/
var BaseMapAreaChooseDialog = function(init_params){
var p = init_params,me = this;
me.dialogId = me._genDomID(‘dialog‘);
me.mapDivId = me._genDomID(‘mapdiv‘);
me.onOkEvent = p.onOkEvent || null;
me.dialogDom = $(‘<div id="‘+ me.dialogId +‘"></div>‘);
$(document.body).append(me.dialogDom);
var dialogParams = p[‘dialog‘] || {};
if(dialogParams.closed == undefined){
dialogParams.closed = true;//dialog默认关闭
}
dialogParams.width = dialogParams.width || 600;
dialogParams.height = dialogParams.height || 440;
dialogParams.modal = true;
dialogParams.title = dialogParams.title || ‘区域标注‘;
dialogParams.content = ‘<div id="‘+me.mapDivId+‘"></div>‘;
dialogParams.buttons = [{
text : ‘确定‘,
iconCls : ‘icon-ok‘,
handler : function(){
var pointsStr = me.map.getPolygonToolDrawPointStr();
var pointsData = me.map.getPolygonToolDrawData();
if(me.onOkEvent){
me.onOkEvent.call(me, pointsData, pointsStr);
}
me.close();
}
},{
text : ‘重新选取‘,
iconCls : ‘icon-edit‘,
handler : function(){
if(me.area){
try{
me.map.map.removeOverLay(me.area);
}catch (e) {
}
me.area = null;
me.map.openPolygonTool();
}
}
},{
text : ‘关闭‘,
iconCls : ‘icon-cancel‘,
handler : function(){
me.close();
}
}];
me.dialogDom.dialog(dialogParams);
me.map = null;
me.mapParams = p[‘map‘] || {};
me.mapParams.mapId = me.mapDivId;
me.mapParams.width = dialogParams.width-31;
me.mapParams.height = dialogParams.height-75;
me.area = null; //选取的区域
me.mapParams.onDrawPolygonComplete = function(points, length, polyline, eventOwn){
me.area = polyline;
};
};
//显示
BaseMapAreaChooseDialog.prototype.show = function(){
if(this.dialogDom){
this.dialogDom.dialog(‘open‘);
if(!this.map){
this.map = new BaseMap(this.mapParams);
this.map.openPolygonTool();
}
}
};
//关闭
BaseMapAreaChooseDialog.prototype.close = function(){
if(this.dialogDom){
this.dialogDom.dialog(‘close‘);
}
};
//关闭
BaseMapAreaChooseDialog.prototype.setTitle = function(title){
if(this.dialogDom){
this.dialogDom.dialog(‘setTitle‘, title || ‘‘);
}
};
//ID生成
BaseMapAreaChooseDialog.prototype._genDomID = function(type){
__map_gen_dom_idx++;
return "_basemap_area_choosedialog_gen_"+ (type || ‘‘) + __map_gen_dom_idx;
};
//全局ID索引
__map_gen_dom_idx = 0;
标签:des style http color io os 使用 java ar
原文地址:http://my.oschina.net/tangSpace/blog/313801