Check Topology in JavaScript?

ShaningYu · ‎03-05-2018

Does current JS API provides topology functions? Thanks.

RobertScheitlin__GISP · ‎03-07-2018

Shaning,

You are still using Legacy style of coding verses AMD which is what you really should be using in today's day and age (Legacy style of coding is not even supported in JS 4.x api). Here is a very simple sample that shows the contains method. Also you will notice that I have used some of your polygon coordinates with wkid 102100 and they do not plot on the map. So I am not sure your data is 102100.

<!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>Polygon Contains</title>

    <link rel="stylesheet" href="https://js.arcgis.com/3.23/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.23/esri/css/esri.css">
    <style>
      html, body, #map {
        height:100%;
        margin: 0;
        padding: 0;
        width:100%;
        overflow:hidden;
      }
    </style>

    <script src="https://js.arcgis.com/3.23/"></script>
    <script>
      var map, editToolbar, ctxMenuForGraphics, ctxMenuForMap;
      var selected, currentLocation;

      require([
        "esri/map", "esri/geometry/Point", "esri/geometry/Polygon",
        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/graphic",
        "esri/Color",
        "esri/tasks/query", "esri/tasks/QueryTask",
        "dojo/domReady!"
      ], function(
        Map, Point, Polygon,
        SimpleLineSymbol,
        SimpleFillSymbol,
        Graphic,
        Color,
        query,
        QueryTask
      ) {

        map = new Map("map", {
          basemap: "satellite",
          center: [20.039, 62.739],
          zoom: 3
        });
        map.on("load", addGraphics);

        function addGraphics() {
          // Adds pre-defined geometries to map
          var polygonSymbol = new SimpleFillSymbol(
            SimpleFillSymbol.STYLE_SOLID,
            new SimpleLineSymbol(
              SimpleLineSymbol.STYLE_DOT,
              new Color([151, 249, 0, 0.8]),
              3
            ),
            new Color([151, 249, 0, 0.45])
          );

          var polygon = new Polygon({
            "rings": [
              [
                [-4226661.916056009, 8496372.808143634],
                [-3835304.3312360067, 8731187.359035634],
                [-2269873.991956003, 9005137.668409634],
                [-1213208.5129420012, 8613780.083589634],
                [-1017529.7205320001, 8065879.464841632],
                [-1213208.5129420012, 7478843.087611631],
                [-2230738.233474003, 6891806.710381631],
                [-2935181.8861500043, 6735263.6764536295],
                [-3522218.263380006, 6891806.710381631],
                [-3952711.606682008, 7165757.01975563],
                [-4265797.674538009, 7283164.295201631],
                [-4304933.433020009, 7635386.121539632],
                [-4304933.433020009, 7674521.880021632],
                [-4226661.916056009, 8496372.808143634]
              ]
            ],
            "spatialReference": {
              "wkid": 102100
            }
          });

          var spolygon = new Polygon({
            "rings": [
              [
                [-8574575.3238, 4706898.530699998],
                [-8574717.6555, 4706897.306000002],
                [-8574736.575, 4706897.310400002],
                [-8575245.9761, 4706912.5276999995],
                [-8575227.622, 4707114.234399997],
                [-8575227.5562, 4707119.869999997],
                [-8575219.9439, 4707238.998999998],
                [-8574736.4339, 4707222.973899998],
                [-8574717.4695, 4707222.967699997],
                [-8574503.5524, 4707224.6489999965],
                [-8574507.9585, 4707120.172899999],
                [-8574507.9603, 4707114.672899999],
                [-8574535.2586, 4706976.1853],
                [-8574575.3238, 4706898.530699998]
              ]
            ],
            "spatialReference": {
              "wkid": 102100
            }
          });

          map.graphics.add(new Graphic(polygon, polygonSymbol));
          map.graphics.add(new Graphic(spolygon, polygonSymbol));
          console.info(polygon.contains(new Point([-76.99, 38.88])));
        }
      });
    </script>
  </head>
  <body class="claro">
      <div id="map"></div>
  </body>
</html>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

View solution in original post

RobertScheitlin__GISP · ‎03-05-2018

Shanning,

Topology is more of a desktop thing, so the best answer is no, but what exactly are you looking for as somethings can be done using the GeometryEngine.

ShaningYu · ‎03-05-2018

Robert: Thanks for your response. What I want to Do a topology validation and see if a point is in a polygon.

RobertScheitlin__GISP · ‎03-05-2018

Shaning,

Then that is definitely possible the Polygon class has a contains method.

https://developers.arcgis.com/javascript/3/jsapi/polygon-amd.html#contains

ShaningYu · ‎03-06-2018

Dear Robert: Thanks for your response. In order to use the contains method, I need to get the polygon feature through a URL on a map service. I tried to query a feature on a map service layer. I type attributeName like 'ABC%' in the Where Box, and then * in the Out Fields Box, and make Return Geometry checked.

The URL generated looks like:

http://myArcGISSite/rest/services/theFolder/theLayer/MapServer/1/query?where=attributeName+like%27AB...html

I am not sure the returned object is a feature (e.g. polygon). Could you guide me how a feature can be returned through URL? Thanks again.

RobertScheitlin__GISP · ‎03-06-2018

Shaning,

You are using the JS API so you would use a QueryTask and Query Class to get the feature from your map service.

QueryTask | API Reference | ArcGIS API for JavaScript 3.23

Query | API Reference | ArcGIS API for JavaScript 3.23

ShaningYu · ‎03-06-2018

Robert: Thanks for your response. I use a similar approach to get the polygon feature (termed selected_Poly here). Then I use

var b = selected_Poly.contains(pt);

get Object doesn't support property or method 'contains'. How can the selected feature be cast as a polygon? Thanks.

RobertScheitlin__GISP · ‎03-06-2018

Shaning,

Is the var selected_Poly a Graphic or a Polygon class?

If it is a Graphic which is the normal result of a QueryTask then you just need to use

selected_Poly.geometry.contains(pt);

ShaningYu · ‎03-06-2018

var selected_Poly = response.features.geometry.rings[0]; // e.g. i =0

RobertScheitlin__GISP · ‎03-06-2018

Shanning,

That means that you have an array of point and not a polygon. If you omit the rings[0] portion you then have the Polygon class.