• openlayer+udig+geowebcache+


    2011-01-19 10:50 4735人阅读 评论(11) 收藏 举报

        说到实时监控,我们不能不承认Openlayers功能的确非常强大。Openlayers中通过很多方式都能实现实时监控。我讲讲我的实现方式。

          我的方式很简单:页面发起异步请求;服务端程序将请求结果处理成GeoJSON串回传至请求页面;请求页面通过OpenLayers提供的OpenLayers.Format.GeoJSON解析GeoJSON串,将结果展现到地图上。

          下面的示例显示:实时获得油机的位置数据,展示到页面上。

    页面程序: 

    1. //初始地图   
    2. function init(){  
    3.     ......  
    4.     vectors = new OpenLayers.Layer.Vector(...);  
    5.     geojson = new OpenLayers.Format.GeoJSON();  
    6.     map.addLayer(vectors);  
    7. }  
    8. //通过DWR异步取得GeoJSon串,交由OpenLayers.Format.GeoJSON来处理.   
    9. function locorie(){  
    10.     //异步发出请求   
    11.     dwrService.orie(orieSeri,function(data){  
    12.         //通过OpenLayers.Format.GeoJSON处理服务端提供的GenJSon串   
    13.         var features = geojson.read(data,"FeatureCollection");  
    14.         if(features) {  
    15.             //将结果展示到地图上   
    16.             vectors.addFeatures(features);  
    17.         }  
    18.     });  
    19. }  
    20. //十秒更新一次数据   
    21. function startOrie(){  
    22.     var t=setTimeout("locorie();startOrie();",10000);  
    23. }  

     服务端程序:

    1. public String[] orie(String orieSeri) {  
    2.     String orieStr = "";  
    3.     boolean state = true;  
    4.     if (null == orieStr || "".equals(orieSeri)) {  
    5.         state = false;  
    6.     }  
    7.     int dataSeri = Integer.parseInt(orieSeri);  
    8.     List<Location> list = null;  
    9.     if (state) {  
    10.         // 获得dataSeri之后的位置数据 Location.getDataSeri >= dataSeri   
    11.         list = locDao.findLocByFlow(dataSeri);  
    12.     }  
    13.     if (state && (list == null || list.size() == 0)) {  
    14.         // 没有数据   
    15.         state = false;  
    16.     }  
    17.     if (state&&(list.size() == 1 && dataSeri == list.get(0).getDataSeri()  
    18.                     .intValue())) {  
    19.         // 没有新的数据   
    20.         state = false;  
    21.     }  
    22.       
    23.     if (state) {  
    24.         LineString line = new LineString();  
    25.         StringBuffer geo = new StringBuffer();  
    26.         Point pointEnd = new Point();  
    27.         Feature feaPoint = new Feature(pointEnd);  
    28.         Map<String, String> propoint = new HashMap<String, String>();  
    29.         feaPoint.setProperties(propoint);  
    30.         for (int i = 0; i < list.size(); i++) {  
    31.             geo.append("[" + list.get(i).getCurLoc() + "]");  
    32.             if (i != (list.size() - 1)) {  
    33.                 geo.append(",");  
    34.             }  
    35.         }  
    36.         line.setLine(geo.toString());  
    37.         Feature feaLine = new Feature(line);  
    38.         Map<String, String> properties = new HashMap<String, String>();  
    39.         properties.put("color", "#1A60CA");  
    40.         feaLine.setProperties(properties);  
    41.         List<Component> components = new ArrayList<Component>();  
    42.         components.add(feaLine);  
    43.         components.add(feaPoint);  
    44.         FeatureCollection feaCol = new FeatureCollection(components);  
    45.         orieStr = feaCol.draw();  
    46.     }  
    47. }  

     服务器端提供的数据格式如下:

     

    1. //一条线   
    2. {  
    3. "type":"FeatureCollection",  
    4. "features":[{  
    5. "type":"Feature",  
    6. "geometry":{  
    7. "type":"LineString",  
    8. "coordinates":[[42.895131111145, 22.148587703705],[43.895131111145, 23.148587703705]]}}]  
    9. }  
      

     服务器端生成json串,我用装饰者模式写了一个模块,只要调用这个模块的API就会生成需要的Json串。

     

  • 相关阅读:
    Node爬虫之初体验
    Angular中ui-router实现路由嵌套案例
    Angular路由与多视图综合案例
    面试一周10多家公司面试问题总结 ,react相关的并没多少
    单页面应用和多页面应用
    dangerouslySetInnerHTML 正常解析后台返回的html
    文件上传服务器跨域问题
    回流的触发方式
    antd 树的递归 循环展示部门组织架构
    日常杂项记录:(jquery弹出层插件、js判断是pc还是移动端)
  • 原文地址:https://www.cnblogs.com/moonvan/p/2307770.html
Copyright © 2020-2023  润新知