【学习笔记之Openlayers3】要素保存篇(第四篇)

    上一篇中已经讲了要素的绘制功能,既然要素都绘制出来了,绘制完就应该保存起来了吧,那么怎么保存呢?这一篇就是讲解怎么保存绘制好的要素的。

个人用到过两种保存要素的方法,一种是通过WFS直接保存要素入库,另一种是通过ajax的方法通过项目的服务器端保存到数据库中。
先说一下自己项目的开发环境:openlayers3+geoserver+postgresql+postgis。这篇保存也是基于这个基础做的。

基于ajax进行要素保存操作

    基于ajax的方法其实就是获取要素的属性以及几何对象,然后传参数到后台,通过sql的insert语句插入到数据库中。这种方法很简单,很容易实现。

这个方法我就不贴代码了,只要会传参,会用ajax应该能就能做出来。至于绘制好的Geometry对象怎么传,我用的是openlayers3中ol.format.WKT 方法将Geometry对象转化为WKT描述的字符串,传到后台进行操作的。但要记住一点:ajax要选择post,get是有限制的。这个应该都知道的。


基于WFS进行要素保存操作

    其实我一开始用的就是WFS进行要素保存操作,后来由于项目需求:要素的编辑需要有审核功能,审核通过才能入库。只能改成ajax方法了。因为WFS是直接将要素添加到数据库表中的。

以添加为例:

/*发送wfs请求*/
function addWfs(features) {
      var WFSTSerializer = new ol.format.WFS();
      // 添加要素
      var featObject = WFSTSerializer.writeTransaction(features,
        null, null, {
          featureType: 'bou_py', //feature对应图层
          featureNS: 'http://www.cxdt.com',//为创建工作区时的命名空间URI
          srsName: 'EPSG:4326'// 坐标系
        });
      var serializer = new XMLSerializer();
      // 将参数转换为xml格式数据
      var featString = serializer.serializeToString(featObject);
      var request = new XMLHttpRequest();
      request.open('POST', 'http://localhost:8080/geoserver/wfs?service=wfs');
      request.setRequestHeader('Content-Type', 'text/xml');
      request.send(featString);
    }

这样就可以实现通过WFS进行要素编辑的功能了。
关于ol.format.WFS的writeTransaction方法官网API


可能出现的问题

1.问题描述:请求发送了,但是没成功,根据请求的返回信息看到:read-only,意思就是这个图层只读,不能进行修改。

【学习笔记之Openlayers3】要素保存篇(第四篇)_第1张图片

出现的原因:
1.这个工作区或者这个图层是只读的。
解决方案:
【学习笔记之Openlayers3】要素保存篇(第四篇)_第2张图片

【学习笔记之Openlayers3】要素保存篇(第四篇)_第3张图片

2.可能是当前用户没有权限进行编辑
解决方案:
【学习笔记之Openlayers3】要素保存篇(第四篇)_第4张图片

【学习笔记之Openlayers3】要素保存篇(第四篇)_第5张图片

【学习笔记之Openlayers3】要素保存篇(第四篇)_第6张图片

你可能感兴趣的:(Openlayers)