isSelfIntersecting for esri/dijit/Measure - always true

Ravichandran_M_Kaushika · ‎02-06-2017

dear Readers,

thank you for taking the time to help me out.

We are using esri/dijit/Measure widget in our application - esri JS API 3.18.

Our end users are predominantly ArcMap users for many many years and laying out specification for the web UI. We are implementing a measurement feature using esri/dijit/Measurement in the application. this measurement js tool allows users to draw self intersecting polygon and still computes the area. End users dont like the tool computing area for self intersecting polygons even though ArcMap allows measurement tool to draw a self intersecting polygon and computes the area.

there is a polygon.isSelfIntersecting flag and it always returns true even for simple triangle.

geometry.isSelfIntersecting(geometry);
true
esri.geometry.polygonSelfIntersecting(geometry);
true
geometry.isSelfIntersecting()
true

I was planning to use this flag to raise an alert - looks like I am stuck.

thanks for your help.

regards

ravi.

thejuskambi · ‎02-06-2017

It works fine, here is a sample. Can you share some code to see how you are using it.

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Measure Tool</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.18/esri/themes/calcite/dijit/calcite.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.18/esri/themes/calcite/esri/esri.css">
    <style>
      html,body {
        height:100%;
        width:100%;
        margin:0;
      }
      body {
        background-color:#FFF;
        overflow:hidden;
        font-family:"Trebuchet MS";
      }
      #map {
        border:solid 2px #808775;
        -moz-border-radius:4px;
        -webkit-border-radius:4px;
        border-radius:4px;
        margin:5px;
        padding:0px;
      }
      #titlePane{
        width:280px;
      }
      </style>
      <script src="https://js.arcgis.com/3.19/"></script>
    <script>
    var map;
    require([
        "dojo/dom",
        "esri/Color",
        "dojo/keys",
        "dojo/parser","dojo/on",

        "esri/config",
        "esri/sniff",
        "esri/map",
        "esri/SnappingManager",
        "esri/dijit/Measurement",
        "esri/layers/FeatureLayer",
        "esri/renderers/SimpleRenderer",
        "esri/tasks/GeometryService",
        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",

        "esri/dijit/Scalebar",
        "dijit/layout/BorderContainer",
        "dijit/layout/ContentPane",
        "dijit/TitlePane",
        "dijit/form/CheckBox",
        "dojo/domReady!"
      ], function(
        dom, Color, keys, parser, on,
        esriConfig, has, Map, SnappingManager, Measurement, FeatureLayer, SimpleRenderer, GeometryService, SimpleLineSymbol, SimpleFillSymbol
      ) {
        parser.parse();
        //This sample may require a proxy page to handle communications with the ArcGIS Server services. You will need to
        //replace the url below with the location of a proxy on your machine. See the 'Using the proxy page' help topic
        //for details on setting up a proxy page.
        esriConfig.defaults.io.proxyUrl = "/proxy/";
        esriConfig.defaults.io.alwaysUseProxy = false;

        //This service is for development and testing purposes only. We recommend that you create your own geometry service for use within your applications
        esriConfig.defaults.geometryService = new GeometryService("https://utility.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");

        map = new Map("map", {
          basemap: "satellite",
          center: [-85.743, 38.256],
          zoom: 17
        });

        var sfs = new SimpleFillSymbol(
          "solid",
          new SimpleLineSymbol("solid", new Color([195, 176, 23]), 2),
          null
        );

        var parcelsLayer = new FeatureLayer("https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Louisville/LOJIC_LandRecords_Louisville/...", {
          mode: FeatureLayer.MODE_ONDEMAND,
          outFields: ["*"]
        });
        parcelsLayer.setRenderer(new SimpleRenderer(sfs));
        map.addLayers([parcelsLayer]);

        //dojo.keys.copyKey maps to CTRL on windows and Cmd on Mac., but has wrong code for Chrome on Mac
        var snapManager = map.enableSnapping({
          snapKey: has("mac") ? keys.META : keys.CTRL
        });
        var layerInfos = [{
          layer: parcelsLayer
        }];
        snapManager.setLayerInfos(layerInfos);

        var measurement = new Measurement({
          map: map
        }, dom.byId("measurementDiv"));
        measurement.startup();
        
        on(measurement, "measure-end", function(evt){
          alert("isSelfIntersecting: " + evt.geometry.isSelfIntersecting(evt.geometry));
        });
      });
    </script>
  </head>

  <body class="calcite">
    <div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline',gutters:false"
    style="width:100%; height:100%;">
      <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
        <div style="position:absolute; right:20px; top:10px; z-Index:999;">
          <div id="titlePane" data-dojo-type="dijit/TitlePane" data-dojo-props="title:'Measurement', closable:false, open:false">
            <div id="measurementDiv"></div>
            <span style="font-size:smaller;padding:5px 5px;">Press <b>CTRL</b> to enable snapping.</span>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Ravichandran_M_Kaushika · ‎02-06-2017

Thejus Kambi,

good afternoon. thanks for the info. I went back to the code and saw the similarities...

dojo.connect(measure, "onMeasureEnd", function (activeTool, geometry) {

var unitSelected = "";

unitSelected = document.getElementsByClassName('dijit dijitReset dijitInline esriToggleButton')[0].innerText;

// https://developers.arcgis.com/javascript/3/jsapi/units-amd.html

//http://geodienste-umwelt.hessen.de/arcgis_js_api/sdk_37/jsapi/geometryservice.html

if (geometry.type === "polygon") {

var isSelfIntersectingFlag = geometry.isSelfIntersecting(geometry);

if (isSelfIntersectingFlag) {

alert('Cannot draw self intersecting polygons.');

return;

}

.....

}

it gets called after the user completes the polygon sketch.

still it gives a value of true always whether or not it is self intersecting.

thanks for your time.

Thanks Robert for marking this helpful.

regards

ravi.

Ravichandran_M_Kaushika · ‎02-07-2017

It became evident from ESRI that it is a known issue for 3.18 and is fixed in JS 3.19. we changed our references to 3.19 and it is working fine.

thanks to both of you for your promptness.

regards

ravi.