一、封装点的更新

  1. class Point{
  2.     static update({
  3.         fid,
  4.         position,
  5.         attr,
  6.         service,
  7.         layer
  8.     }) {
  9.         /* 1、确定修改的几何位置 */
  10.         var gpoint = new Zondy.Object.GPoint(position[0],position[1]) // 修改位置
  11.         /* 设置当前点要素的几何信息 */
  12.         var fGeom = new Zondy.Object.FeatureGeometry({
  13.             PntGeom: [gpoint]
  14.         })
  15.         /* 2、样式信息 */
  16.         /* 2.2 设置样式信息 */
  17.         var pointInfo = new Zondy.Object.CPointInfo(POINT_STYLE)
  18.         /* 设置当点要素的图形参数信息 */
  19.         var webGraphicInfo = new Zondy.Object.WebGraphicsInfo({
  20.             InfoType: 1, //点
  21.             PntInfo: pointInfo
  22.         })
  23.         /* 3、属性 */
  24.         var attValue = attr.map(item=>item.value)
  25.         /* 4、设置要素 */
  26.         var feature = new Zondy.Object.Feature({
  27.             fGeom: fGeom, //坐标--几何信息
  28.             GraphicInfo: webGraphicInfo, //样式信息
  29.             AttValue: attValue //属性
  30.         })
  31.         /* 设置要素为点要素 
  32.         点 -->1
  33.         线 -->2
  34.         面 -->3
  35.         */
  36.         feature.setFType(1)
  37.         feature.setFID(fid) //++
  38.         /* 5、设置要素集,添加要素 */
  39.         //创建一个要素数据集
  40.         var featureSet = new Zondy.Object.FeatureSet()
  41.         /* 设置属性结构 */
  42.         var cAttStruct = new Zondy.Object.CAttStruct({
  43.             FldName: attr.map(item=>item.key),
  44.             FldNumber: attr.length, //属性的个数
  45.             FldType: attr.map(item=>item.type)
  46.         })
  47.         featureSet.AttStruct = cAttStruct
  48.         /* 添加要素到要素数据集 */
  49.         featureSet.addFeature(feature)
  50.         /* 6、调用服务,执行更新 */
  51.         /* 
  52.     创建一个编辑服务类 
  53.     第一个参数：服务的名称 第二参数：图层的名称
  54.     */
  55.         var editService = new Zondy.Service.EditDocFeature(service.name, service.layerId, {
  56.             ip: 'localhost',
  57.             port: '6163' //访问IGServer的端口号, .net为6163,Java为8089
  58.         })
  59.         //执行添加点要素功能
  60.         editService.update(featureSet, this.onPntSuccess(layer))
  61.     }
  62. }

二、例子

1、通过拉框查询获取geometry
2、调用查询服务，获取fid
3、根据fid，更新元素的位置及属性
draw.gif

  1. <!DOCTYPE html>
  2. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>Document</title>
  8.     <script src="./dist/include-openlayers-local.js"></script>
  9.     <script src="./libs/gaode.js"></script>
  10.     <script src="./utils/Draw.js"></script>
  11.     <script src="./libs/Query.js"></script>
  12.     <script src="./libs/Point.js"></script>
  13. </head>
  15. <body>
  16.     <button class="btn btn-primary" onclick="active()">激活</button>
  17.     <div id="map_container">
  18.     </div>
  19.     <script>
  20.         var ig_server = 'xzd_city'
  21.         var docLayer = new Zondy.Map.Doc('', ig_server, {
  22.             ip: 'localhost',
  23.             port: 6163
  24.         })
  25.         var map = new ol.Map({
  26.             target: "map_container",
  27.             layers: [gaode],
  28.             view: new ol.View({
  29.                 projection: 'EPSG:4326',
  30.                 center: [114.30, 30.50],
  31.                 zoom: 4
  32.             })
  33.         })
  34.         map.addLayer(docLayer)
  35.         const source = new ol.source.Vector({
  36.             wrapX: false
  37.         })
  38.         const layer = new ol.layer.Vector({
  39.             source: source
  40.         })
  41.         map.addLayer(layer);
  42.         //2.3 创建画笔
  43.         let draw = null;
  45.         function active() {
  46.             draw = createDraw({
  47.                 type: "Rectangle",
  48.                 source,
  49.                 callback: handleDraw
  50.             })
  51.             map.addInteraction(draw);
  52.         }
  54.         function handleDraw(e) {
  55.             var geometry = e.feature.getGeometry();
  56.             Query.queryByGeom({
  57.                 geometry,
  58.                 service: {
  59.                     name: ig_server,
  60.                     layerId: 2
  61.                 },
  62.                 callback: onQuerySuccess
  63.             })
  64.         }
  66.         function onQuerySuccess(e) {
  67.             var res = e.SFEleArray
  68.             var fids = res.map(item => item.FID);
  69.             var attr = [{key:"name",value:"北京",type:"string"}]
  70.             var service = {name:ig_server,layerId:2}
  71.             var layer = docLayer;
  72.             Point.update({
  73.                 fid:fids[0],
  74.                 position:[120,40],
  75.                 attr,
  76.                 service,
  77.                 layer
  78.             })
  79.         }
  80.     </script>
  81. </body>
  83. </html>