arcgis server java 气泡显示

1。定义做个MapToolAction实现点击功能。
在MapToolAction中得到要展示的点的基本信息,保存到webcontext中。

// 得到click点,并将信息存储为SimplePointInfo
_context = event.getWebContext();
WebMap map = _context.getWebMap();
WebPoint screenPoint = (WebPoint) event.getWebGeometry();
WebPoint mapPoint = (WebPoint) event.getWebGeometry().toMapGeometry(map);
SimplePointInfo pointInfo = new SimplePointInfo();
pointInfo.setScreenX(screenPoint.getX());
pointInfo.setScreenY(screenPoint.getY());
pointInfo.setMapX(mapPoint.getX());
pointInfo.setMapY(mapPoint.getY());
_context.setAttribute("pointInfo", pointInfo);

2.SimplePointInfo 为保存点信息的bean类

具备下面属性

private double _screenX;
private double _screenY;
private double _mapX;
private double _mapY;


3. 实现AJAXRenderer。
在AJAXRenderer中得到webcontext中保存的基本信息,在添加到xml中。
public void renderAjaxResponse(FacesContext facesContext,UIComponent component, Object state, boolean isEventSource,Element parentElement) {
try {
WebContext context = ((MapControl) component).getWebMap().getWebContext();
SimplePointInfo info = (SimplePointInfo) context.getAttribute("pointInfo");
context.setAttribute("pointInfo", null);
System.out.println("screenX:"+info.getScreenX());
if(info!=null){
Element pointInfo= XMLUtil.createElement("pointInfo", null, parentElement);
Element point= XMLUtil.createElement("point", "", pointInfo);
point.setAttribute("screenX",String.valueOf(info.getScreenX()));
point.setAttribute("screenY",String.valueOf(info.getScreenY()));
point.setAttribute("mapX",String.valueOf(info.getMapX()));
point.setAttribute("mapY",String.valueOf(info.getMapY()));
}
} catch (Exception e) {
}
}
}

4.把实现的AJAXRenderer在ajax-renderers.xml注册
注册后,系统会自动调用,不需要人为调用了。
<list-entries>
.................................

<value>#{ajaxGpAsyncTaskResultsRenderer}</value>
<value>#{MyAjaxRender}</value> <--------- 自己实现的AJAXRenderer,下面是bean的定义。两个名称要一样
</list-entries>

<managed-bean>
<managed-bean-name>MyAjaxRender</managed-bean-name>
<managed-bean-class>com.rasa.MyAjaxRender</managed-bean-class>
<managed-bean-scope>none</managed-bean-scope>
</managed-bean>
..............................
5.客户端设计
5.1加上回调
EsriControls.addPostBackTagHandler("pointInfo", showPointInfo);
//注意pointInfo对应于你上面中建立在response下的pointInfo
5.2显示气泡
function showPointInfo(xml, eventSources) {
//得到点信息
var point = xml.getElementsByTagName("point")[0];
var screenX = point.getAttribute("screenX");
var screenY = point.getAttribute("screenY");
var mapX = point.getAttribute("mapX");
var mapY = point.getAttribute("mapY");

//构造气泡div
var content = "<div id='balloontip'> "+
"<div id='tipclose' onclick='hideBalloonTip();'></div>"+
"<div id='frame1'></div>"+
"<div id='frame2'>"+
"<div id='tiptitle'></div>"+
"<div id='tipcontent'>"+
"<ul id='tipcontent_ul'>"+
"screenX:"+screenX+"<br>"+
"screenY:"+screenY+"<br>"+
"mapX:"+mapX+"<br>"+
"mapY:"+mapY+
"</ul>"+
"</div>"+
"</div>"+
"<div id='frame3'></div>"+
"</div>"

//显示气泡div
var style = "display:block;cursor:default;position:absolute;left:"+screenX+"px;top:"+screenY+"40px;width:282px;z-index:100;";
var map = EsriControls.maps['map1'];
var popUpId = 'divPopUp';
var popUp = document.getElementById(popUpId);
if( popUp==null ) {
popUp = document.createElement('div');
popUp.id = popUpId;
popUp.innerHTML=content;
map.divObject.appendChild(popUp); //注意:要添加到divObject下,否则关闭按钮不起作用
EsriUtils.setElementStyle(popUp, style);
}else{
popUp.innerHTML=content;
EsriUtils.setElementStyle(popUp, style);
}
}

6.其他tool点击时隐藏气泡内容

在esri_map.js内的EsriMap.prototype.setCurrentToolItem下添加
if("Identify"!=toolItem.id){
var popUp = document.getElementById('divPopUp');
if(popUp!=null) popUp.style.display='none';
}

7.透明气泡的css

#frame1{
background:transparent url(../images/balloontip/info_frame_left.png) no-repeat;
width:282px;
height:37px;
}
#frame2{
background:transparent url(../images/balloontip/info_frame_02.png) repeat-y;
width:282px;
}
#frame3{
background:transparent url(../images/balloontip/info_frame_03.png) no-repeat;
width:282px;
height:13px;
}
#tipcontent{
padding-bottom:5px;
}
#tiptitle{
font-family: "宋体";
font-size: 9pt;
font-style: normal;
font-weight: bold;
font-variant: normal;
color: #2d4291;
text-indent:10px;
background: url(../images/balloontip/info_frame_line.gif) no-repeat bottom center;
padding-bottom:5px;
margin:0px;
}
#tipclose{
cursor:pointer;
background: url(../images/balloontip/info_frame_close.gif) no-repeat center center;
top:34px;
left:251px;
position:absolute;
z-index:101;
width:14px;
height:14px;
}

#tipclose:hover{
background: url(../images/balloontip/info_frame_close_J.gif) no-repeat center center;
width:14px;
height:14px;
}

#tipcontent_ul{
padding:5px 10px 5px 13px;
margin:0;
}
#tipcontent_ul li{
font:normal 9pt "宋体";
margin:0px;
padding:0px;
line-height:20px;
text-align:left;
list-style-type:none;
}

posted @ 2011-06-10 16:19  因是因非  阅读(541)  评论(0编辑  收藏  举报