Este post foi publicado originalmente para o OL 3.5 por Dennis Bauszus. N\u00e3o h\u00e1 uma boa raz\u00e3o para n\u00e3o usar a vers\u00e3o mais recente do OpenLayers, mas caso voc\u00ea utilize uma vers\u00e3o mais atual do OL, veja se n\u00e3o precisar\u00e1 realizar alguns ajustes.<\/p>\n
Neste teste foi utilizado o GeoServer 2.8, e o armazenamento de dados \u00e9 realizado em um banco de dados PostGIS 2.1.<\/p>\n
Para o servi\u00e7o de teste, \u00e9 utilizada uma tabela muito simples, apenas com uma ID e geometria. A geometria \u00e9 definida como geometry, sem tipo nem proje\u00e7\u00e3o. \u00c9 importante que o campo de geometria seja chamado de geometria. Caso contr\u00e1rio, as inser\u00e7\u00f5es podem criar registros com campos de geometria vazios. Uma restri\u00e7\u00e3o deve ser definida no ID ou o GeoServer n\u00e3o poder\u00e1 inserir registros na tabela.<\/p>\n
\r\nCREATE TABLE wfs_geom\r\n(\r\n id bigint NOT NULL,\r\n geometry geometry,\r\n CONSTRAINT wfs_geom_pkey PRIMARY KEY (id)\r\n)\r\nWITH (\r\n OIDS=FALSE\r\n);\r\nALTER TABLE wfs_geom\r\n OWNER TO geoserver;\r\n \r\nCREATE INDEX sidx_wfs_geom\r\n ON wfs_geom\r\n USING gist\r\n (geometry);\r\n<\/pre>\nNo n\u00facleo dos snippets de javascript do OL est\u00e1 a fun\u00e7\u00e3o ol.format.WFS.writeTransaction<\/a>, que recebe 4 par\u00e2metros de entrada. Os 3 primeiros par\u00e2metros definem se os dados devem ser inseridos, atualizados ou exclu\u00eddos da fonte de dados. O quarto par\u00e2metro assume a forma de ol.format.GML<\/a> e transmite informa\u00e7\u00f5es sobre o tipo de recurso, namespace e proje\u00e7\u00e3o dos dados.<\/p>\n
O n\u00f3 writeTransaction deve ser serializado com um XMLSerializer<\/a> para ser usado em uma postagem do WFS-T.<\/p>\n
Os tr\u00eas casos de uso (insert\/update\/delete) e a chamada AJAX s\u00e3o mostrados no seguinte trecho de c\u00f3digo.<\/p>\n
\r\nvar formatWFS = new ol.format.WFS();\r\n\r\nvar formatGML = new ol.format.GML({\r\n featureNS: 'https:\/\/gsx.geolytix.net\/geoserver\/geolytix_wfs',\r\n featureType: 'wfs_geom',\r\n srsName: 'EPSG:3857'\r\n});\r\n\r\nvar xs = new XMLSerializer();\r\n\r\nvar transactWFS = function (mode, f) {\r\n var node;\r\n switch (mode) {\r\n case 'insert':\r\n node = formatWFS.writeTransaction([f], null, null, formatGML);\r\n break;\r\n case 'update':\r\n node = formatWFS.writeTransaction(null, [f], null, formatGML);\r\n break;\r\n case 'delete':\r\n node = formatWFS.writeTransaction(null, null, [f], formatGML);\r\n break;\r\n }\r\n var payload = xs.serializeToString(node);\r\n $.ajax('https:\/\/gsx.geolytix.net\/geoserver\/geolytix_wfs\/ows', {\r\n service: 'WFS',\r\n type: 'POST',\r\n dataType: 'xml',\r\n processData: false,\r\n contentType: 'text\/xml',\r\n data: payload\r\n }).done(function() {\r\n sourceWFS.clear();\r\n });\r\n};\r\n<\/pre>\nInser\u00e7\u00f5es s\u00e3o chamadas a partir do evento de “drawend” da intera\u00e7\u00e3o do OL. A fun\u00e7\u00e3o .clear() no sourceWFS recarrega a fonte ap\u00f3s cada transa\u00e7\u00e3o. Isso garante que os IDs de recurso estejam corretos para os novos recursos e que os recursos exclu\u00eddos sejam removidos da exibi\u00e7\u00e3o.<\/p>\n
O ID de um recurso modificado \u00e9 armazenado e a transa\u00e7\u00e3o de atualiza\u00e7\u00e3o \u00e9 lan\u00e7ada quando o recurso \u00e9 desmarcado. Para publicar com \u00eaxito uma transa\u00e7\u00e3o de atualiza\u00e7\u00e3o, a propriedade boundedBy deve ser removida das propriedades do recurso. Um clone do recurso \u00e9 usado para conseguir isso.<\/p>\n
\r\nmap.addInteraction(interactionSelect);\r\ninteraction = new ol.interaction.Modify({\r\n features: interactionSelect.getFeatures()\r\n});\r\nmap.addInteraction(interaction);\r\nmap.addInteraction(interactionSnap);\r\ndirty = {};\r\ninteractionSelect.getFeatures().on('add', function (e) {\r\n e.element.on('change', function (e) {\r\n dirty[e.target.getId()] = true;\r\n });\r\n});\r\ninteractionSelect.getFeatures().on('remove', function (e) {\r\n var f = e.element;\r\n if (dirty[f.getId()]) {\r\n delete dirty[f.getId()];\r\n var featureProperties = f.getProperties();\r\n delete featureProperties.boundedBy;\r\n var clone = new ol.Feature(featureProperties);\r\n clone.setId(f.getId());\r\n transactWFS('update', clone);\r\n }\r\n});\r\n<\/pre>\nVoc\u00ea pode ver o exemplo completo (na vers\u00e3o 3.16 do OL) no jsFiddle<\/a>.<\/p>\n
Fonte: Medium – Dennis Bauszus<\/a> <\/p>\n","protected":false},"excerpt":{"rendered":"
Este post foi publicado originalmente para o OL 3.5 por Dennis Bauszus. N\u00e3o h\u00e1 uma boa raz\u00e3o para n\u00e3o usar a vers\u00e3o mais recente do OpenLayers, mas caso voc\u00ea utilize uma vers\u00e3o mais atual do OL, veja se n\u00e3o precisar\u00e1… Continue Reading →<\/a><\/p>\n","protected":false},"author":275,"featured_media":7318,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[24],"tags":[250,218],"class_list":["post-7251","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-gis","tag-openlayers","tag-wfs"],"_links":{"self":[{"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/posts\/7251","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/users\/275"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/comments?post=7251"}],"version-history":[{"count":5,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/posts\/7251\/revisions"}],"predecessor-version":[{"id":7320,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/posts\/7251\/revisions\/7320"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/media\/7318"}],"wp:attachment":[{"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/media?parent=7251"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/categories?post=7251"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fernandoquadro.com.br\/html\/wp-json\/wp\/v2\/tags?post=7251"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}