gllhde 发表于: 2008-10-30 20:14 来源: 博客乐园
3．3．3 编写生成地图的服务端代码这里所指的生成地图的服务端代码是指web服务器中servlet响应客户端请求生成图片信息的代码，具体讲就是指servlet中重写的doGet( )方法中的代码。特别注意的是，这里所指的生成地图的代码是我们通过调用MapJ的API向地图服务器发送生成地图请求的代码；相对地图服务器而言，我们这里编写的又是地图服务的客户端代码；相当于web应用而言，我们这里编写的却又是服务端代码。
下面我们以一个实例来介绍如何调用MapJ API编写生成地图的服务端代码。
第一步：向地图服务器发送请求生成地图
CODE:
// 输出图片的格式 第一步显示效果如下：
private static String mimeType = "image/gif";
// mapxtremeservlet地图服务器url
private static String m_mxtURL = "http://localhost:80/mapxtreme480/servlet/mapxtreme";
// 实现HttpServlet的doGet方法
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException {
// 设置ContentType
response.setContentType(mimeType);
// 返回响应的输出流
ServletOutputStream sos = response.getOutputStream();
// 创建MapJ对象
MapJ m_mapj = new MapJ();
try {
// 加载地图
String m_mapPath="E:\\gisapp\\MapData\\Others\\China.mdf";
m_mapj.loadMapDefinition(m_mapPath);
// 设置地图大小
m_mapj.setDeviceBounds(new DoubleRect(0, 0, 800, 600));
request.getSession().setAttribute("worldMap", m_mapj);
// 创建图像请求器(包装mapj对象,图片的色位,底色,格式信息)
ImageRequestComposer irc = ImageRequestComposer.create(m_mapj, 256,
Color.white, mimeType);
// 创建mxtj的图像渲染器
MapXtremeImageRenderer renderer = new MapXtremeImageRenderer(
m_mxtURL);
// 用渲染器渲染请求器
renderer.render(irc);
// 渲染器输出图片流到输出流,客户端显示之
renderer.toStream(sos);
// 释放渲染器对象
renderer.dispose();
} catch (Exception e) {
System.out.println("Error");
e.printStackTrace();
}
}
第二步：控制地图的显示(响应客户端对地图放大、缩小、重定位、平移的请求)
CODE:
int xpoint=Integer.parseInt(request.getParameter("xpoint"));//鼠标left坐标 第二步，点击放大后可看到主要城市的图层信息，效果如下：
int ypoint=Integer.parseInt(request.getParameter("ypoint"));//鼠标top坐标
double zoomSize=Double.parseDouble(request.getParameter("zoomSize"));//缩放比
// 返回响应的输出流
ServletOutputStream sos = response.getOutputStream();
// 获取地图对象
MapJ m_mapj = (MapJ)request.getSession().getAttribute("worldMap");
try {
// 设置地图大小
DoublePoint dpt= m_mapj.transformScreenToNumeric(new DoublePoint(xpoint,ypoint));
m_mapj.setCenter(dpt);
// 创建图像请求器(包装mapj对象,图片的色位,底色,格式信息)
ImageRequestComposer irc = ImageRequestComposer.create(m_mapj, 256,
Color.white, mimeType);
// 创建mxtj的图像渲染器
MapXtremeImageRenderer renderer = new MapXtremeImageRenderer(
m_mxtURL);
// 用渲染器渲染请求器
renderer.render(irc);
// 渲染器输出图片流到输出流,客户端显示之
renderer.toStream(sos);
// 释放渲染器对象
renderer.dispose();
} catch (Exception e) {
e.printStackTrace();
}
进一步放大后，能看到更多的图层信息，效果如下：
第三步：查询图层信息(根据客户端点击的地图位置，展现不通的图层信息)
CODE:
PrintWriter out = response.getWriter(); 第三步，点击右键菜单，查看城市坐标图层信息：
HttpSession session = request.getSession();
String xmlInfo = "";
xmlInfo +="";
try {
int xpoint=Integer.parseInt(request.getParameter("xpoint"));
int ypoint=Integer.parseInt(request.getParameter("ypoint"));
MapJ mainMap = (MapJ) session.getAttribute("worldMap");
FeatureLayer layer = (FeatureLayer) mainMap.getLayers().get("CHCTY_2K");
//创建一个图原层
if (layer.isVisibleAtCurrentZoom()) {
ArrayList columns = new ArrayList();
columns.add("lace_Name");
columns.add("Latitude");
columns.add("Longitude");
DoubleRect rect = mainMap.transformScreenToNumeric(new DoubleRect(new DoublePoint(xpoint-100, ypoint-100), new DoublePoint(xpoint+100, ypoint+100)));
FeatureSet fs = layer.searchWithinRectangle(columns, rect, QueryParams.EMPTY_PARAMS);//得到图元集
Feature f;
while ((f = fs.getNextFeature()) != null ) {
for (int i = 0; i < f.getAttributeCount(); i++) {
switch (i)
{
case 0:
xmlInfo +=""+f.getAttribute(i)+"";
break;
case 1:
xmlInfo +=""+f.getAttribute(i)+"";
break;
case 2:
xmlInfo +=""+f.getAttribute(i)+"";
break;
}
}
}
fs.dispose();
}
} catch (Exception ex) {
ex.printStackTrace();
}
xmlInfo +="";
out.print(xmlInfo);
查询出一定范围内的城市的坐标信息，示例效果如下：
3．3．4 控制页面与后台的交互获取客户端鼠标点击位置：
CODE:
设置鼠标指针样式：
/**
*获取地图的偏移量
*/
var xOffset=0;
var yOffset=0;
function getObjOffset(){
var obj=document.all('chinaMap');
var xOff, yOff;
xOff = 0;
yOff = 0;
while (null != obj) {
xOff += obj.offsetLeft;
yOff += obj.offsetTop;
obj = obj.offsetParent;
}
xOffset=xOff;
yOffset=yOff;
}
var xpoint=event.x- xOffset;//鼠标x坐标
vary point=event.y- yOffset;//鼠标y坐标
element.style.cursor=”hand”;
element.style.cursor=”move”;
设置菜单位置（若有右键操作时可设置）：
menuDiv.style.left=event.x;
menuDiv.style.top=event.y;