Union geometry service

[Anonymous User]

Hi all,

I am trying to make the geometry service work but I am unsuccessful. Any idea why?

Here is my code

 var map;

        require([
          "esri/InfoTemplate",
          "esri/map",
          "esri/layers/FeatureLayer",
          "esri/symbols/SimpleFillSymbol",
          "esri/symbols/SimpleLineSymbol",
          "esri/tasks/query",
          "esri/toolbars/draw",
          "esri/tasks/GeometryService",
          "esri/dijit/editing/Union",
          "dojo/dom",
          "dojo/on",
          "dojo/parser",
          "dojo/_base/array",
          "esri/Color",
          "dijit/form/Button",
          "dojo/domReady!"
        ],
          function (
            InfoTemplate, Map, FeatureLayer, SimpleFillSymbol, SimpleLineSymbol,
            Query, Draw, GeometryService, Union, dom, on, parser, arrayUtil, Color
          ) {

              parser.parse();


              var geometryService = new GeometryService("https://utility.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");

              var selectionToolbar, featureLayer;

              map = new Map("map", {
                  basemap: "streets",
                  center: [-97.395, 37.537],
                  zoom: 11
              });

              map.on("load", initSelectToolbar);

              var fieldsSelectionSymbol =
                new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
                  new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
                new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.5]));


              featureLayer = new FeatureLayer("https://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/1",
                {
                    mode: FeatureLayer.MODE_SNAPSHOT
                });

              featureLayer.setSelectionSymbol(fieldsSelectionSymbol);

              map.addLayer(featureLayer);

              $("#selectFieldsButton").click(function () {
                  selectionToolbar.activate(Draw.EXTENT);
              });

              $("#clearSelectionButton").click(function () {
                  featureLayer.clearSelection();
              });

              function initSelectToolbar(event) {
                  selectionToolbar = new Draw(event.map);
                  var selectQuery = new Query();

                  on(selectionToolbar, "DrawEnd", function (geometry) {
                      selectQuery.geometry = geometry;
                      featureLayer.selectFeatures(selectQuery,
                        FeatureLayer.SELECTION_NEW);
                  });

                  on(featureLayer, "onSelectionComplete", function (features) {
                      if (features.length === 1) {
                          var targetGeometry = features[0].geometry;
                          geometryService.union(targetGeometry);
                      }
                  });
                  on(geometryService, "union-complete", function (uniongeometries) {
                      var targetGraphic = featureLayer.getSelectedFeatures()[0].setGeometry(uniongeometries);
                      featureLayer.applyEdits(null, [targetGraphic], null);
                  });
                 
              }
          });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[RobertScheitlin__GISP]

Alex,

   The GeometryService.union is suppose to called on an array of geometries that you want to union. In your code you are only passing one geometry.

[Anonymous User]

Right thank you Robert, I corrected it:

 var targetGeometry = features.geometry;

featureLayer.getSelectedFeatures().setGeometry(uniongeometries);

However I am still unsuccessful.

 

The selection is made and shows up but not the union.

[RobertScheitlin__GISP · Accepted solution]

Alex,

   I think you may be confused about the GeomtryService (GS). The GS knows nothing about selected features or a feature layer in general. When you use

GS.union([this is the array of all geometries that you want combined]);‍

So your function may look like this:

require([
  "esri/graphicsUtils", ... 
], function(graphicsUtils, ... ) {
....


                  on(featureLayer, "onSelectionComplete", function (features) {
                      if (features.length > 1) {
                          var targetGeometry = graphicsUtils.getGeometries(featureLayer.getSelectedFeatures());
                          geometryService.union(targetGeometry);
                      }
                  });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[Anonymous User]

Yes I am confused by the GS and the end result of OnselectionComplete. I thought the OnselectionComplete results would be enough as geometries to pass into the GS. Thanks for the help here Robert.

[Anonymous User]

The union tool looks like a charm now . For some reasons the first draw does not accomplish the union, the second draw does the job.

Now, for any of you wondering what the full code would be:

on(selectionToolbar, "DrawEnd", function (geometry) {
selectQuery.geometry = geometry;
featureLayer.selectFeatures(selectQuery,
FeatureLayer.SELECTION_NEW);
var targetGeometry = graphicsUtils.getGeometries(featureLayer.getSelectedFeatures());
geometryService.union(targetGeometry, function (geometry) {
featureLayer.clearSelection();
var symbol = new SimpleFillSymbol("none", new SimpleLineSymbol("solid", new Color([255, 255, 255]), 2), new Color([255, 255, 255, 0.25]));
var graphic = new Graphic(geometry, symbol);
map.graphics.add(graphic);
console.log(targetGeometry);
});

});