mapxtreme java_用mapXtreme Java开发web gis应用 (下)

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;