topic Re: Mapping boundary geometry in ArcGIS JavaScript Maps SDK Questions

Mapping boundary geometry

AndrewRousseau — Sat, 12 Nov 2016 00:49:12 GMT

I'm new to working with esri and I am struggling a bit with mapping polygons. All of the examples are far more complex than I need at the moment. I thought I would start by trying to map a single boundary from my data set which I have included in the JSFiddle below. I seem to be missing a step somewhere as the shape does not appear on the map. Can someone please take a look and post back a functional version of this code? I think it will make sense to me once I see some simple functional code. Thanks!

Edit fiddle - JSFiddle

Re: Mapping boundary geometry

DanPatterson_Retired — Sat, 12 Nov 2016 00:52:09 GMT

are those UTM or other projected coordinates? Does the basemap use web mercator for its projection? If so, they won't align unless there is some projection-on-the-fly ability

Re: Mapping boundary geometry

AndrewRousseau — Sat, 12 Nov 2016 01:17:00 GMT

The geometry originated from this system AGRC Developer Web API and my example is using the first result from here. The end goal is to store that geometry in my own database and to be able to map applicable boundaries as needed in my web application. I'm not sure what type of coordinates those are so hopefully those links can provide you with more information. Looking for any suggestions anyone has on how to work with this data set.

Re: Mapping boundary geometry

DanPatterson_Retired — Sat, 12 Nov 2016 01:41:52 GMT

from your first link

Searching API Methods ... under spatial reference

The spatial reference for the output and input geometries. The output and input spatial references must match.

Choose any of the wkid's from the Geographic Coordinate System wkid reference or Projected Coordinate System

wkid reference. 26912 is the default.

The default is probably not what you want.

I would check the spatial references of the destination map... perhaps it is in web mercator, which means you would want your input coordinates to match those.

Re: Mapping boundary geometry

AndrewRousseau — Sat, 12 Nov 2016 02:38:09 GMT

It has these suggestions:

Popular wkid's
Web Mercator 3857
Latitude/Longitude (WGS84) 4326

Is one of of those preferable over the other?

Here is a fiddle for 4326 Latitude/Longitude (WGS84) Edit fiddle - JSFiddle

Here is one for Web Mercator 3857 Edit fiddle - JSFiddle

What I really need is a functional fiddle demonstrating how to get a boundary to display. Thanks!

Re: Mapping boundary geometry

DanPatterson_Retired — Sat, 12 Nov 2016 03:01:47 GMT

as long as they match... web mercator is used by google etc

Re: Mapping boundary geometry

AndrewRousseau — Sat, 12 Nov 2016 03:51:16 GMT

I'm able to take a google maps example of mapping a simple polygon and swap out the lat lng boundary coordinates and produce a hello world like this Edit fiddle - JSFiddle in about 10 minutes.

I've spent far too much time trying to track down the equivalent example in Esri without luck and so far failed to produce a hello world of drawing a simple polygon. Is it just me or have other people experienced this frustration getting started with Esri?

Re: Mapping boundary geometry

RobertScheitlin__GISP — Sun, 12 Dec 2021 07:24:15 GMT

Andrew,

So using the polygon coordinate from your 4326 Lat Lon Fiddle here is all the JS corrections to make you app work.

Your issues:

Requires were out of sequence with their vars
your tundra.css was listed as a javascript instead of style link
You were never doing anything with the polygon once it was created (i.e creat a graphic and add it to the map).

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="https://js.arcgis.com/3.18/esri/css/esri.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.18/dijit/themes/tundra/tundra.css">
    <script type="text/javascript" src="https://js.arcgis.com/3.18/"></script>

    <style type="text/css">
        html,
        body,
        #map {
            height: 100%;
            padding: 0;
            margin: 0;
        }
    </style>

    <title></title>

    <script type='text/javascript'>
      var map;
      var poly;
      var rings = [[[-111.84643929747681,41.794747499777252],[-111.84746944059417,41.777777585460555],[-111.84722308493257,41.777765081563238],[-111.84734540274029,41.77617950435792],[-111.839087246083,41.776067995928258],[-111.83907815798979,41.777678497549928],[-111.83416432833802,41.777613405008282],[-111.83423339873944,41.774308267743493],[-111.83627435094607,41.774331258087088],[-111.83650250420743,41.768739904101523],[-111.83434976877875,41.768711424486327],[-111.83449674865503,41.759535898715534],[-111.83153767163584,41.759454674692073],[-111.8315677943355,41.758526742051714],[-111.83005910082632,41.758508829782208],[-111.83006868956933,41.758786174224618],[-111.82900446855203,41.758908246313581],[-111.8289949753526,41.759385682551219],[-111.82487316219854,41.759248721473909],[-111.82484602484318,41.75872651380071],[-111.82412031298628,41.758699296726014],[-111.82408175711976,41.759352576430167],[-111.82157828434823,41.759339882469213],[-111.80856646658245,41.759080021683424],[-111.80888335765516,41.758450907732829],[-111.79995750845733,41.758533218450872],[-111.79997094742524,41.759712134102493],[-111.79943687524859,41.7597149508701],[-111.79943670060027,41.760282389603589],[-111.794542463224,41.760329851277262],[-111.79455678654557,41.762173473662926],[-111.78013221695674,41.762213781174466],[-111.78011696035968,41.758570573926249],[-111.78495497954226,41.758559238277535],[-111.78482197208915,41.7440868600572],[-111.78156279026786,41.7440874593831],[-111.78155632116017,41.742859852735791],[-111.78020013424161,41.742692533027387],[-111.78014870144392,41.740331252611682],[-111.78496129064149,41.740319191050837],[-111.78493577681539,41.741680319679745],[-111.78970647436134,41.74167645161603],[-111.78967003464045,41.736739076030581],[-111.78863710553577,41.73674166684853],[-111.79046584125427,41.731520359958182],[-111.78882018631835,41.731754142022737],[-111.78486131889905,41.73171369944793],[-111.78499946200444,41.72597439833222],[-111.79443348172011,41.725930276684629],[-111.79442818142205,41.718960693687741],[-111.80329766254188,41.718942265098015],[-111.80349393133687,41.719353413765987],[-111.80335524844719,41.719608380997776],[-111.80024649454289,41.719618364056387],[-111.80028472026963,41.722408467878054],[-111.80404656373796,41.722312852462288],[-111.8040572551968,41.72288111942806],[-111.80383873196455,41.723000640046038],[-111.80378996681196,41.723428813694241],[-111.80406543031074,41.723440396945627],[-111.80426954555739,41.728335171540131],[-111.80516834834002,41.728386521609465],[-111.80536162726462,41.728169899967561],[-111.80645891488531,41.729382651139673],[-111.80488862337847,41.729383753933163],[-111.80488383474777,41.729096464470821],[-111.80350585656187,41.72909169756678],[-111.80350720905331,41.729586171914292],[-111.80429714973558,41.729584248024857],[-111.80429780172038,41.729443734409053],[-111.80900365606557,41.72942330792354],[-111.80907020278781,41.728881519276776],[-111.81005415995379,41.7282449980952],[-111.81096223382573,41.728172841697329],[-111.8109733064102,41.728001630720307],[-111.81174417257014,41.727918727365854],[-111.8126396280047,41.727895284611236],[-111.814072155668,41.72822290649885],[-111.81407338367458,41.728320173289752],[-111.81634435967105,41.728393230567228],[-111.81692316932451,41.72786130732181],[-111.81854163028665,41.7275849837872],[-111.81969445009173,41.725864536703185],[-111.82079713040415,41.725688234486974],[-111.82155833637722,41.725133367924336],[-111.823162513576,41.724686849288709],[-111.82391630308972,41.724683248188327],[-111.82578374857987,41.725081462220516],[-111.82931770552543,41.724365174264683],[-111.83051245519115,41.724340332476181],[-111.83096484492604,41.72417943944739],[-111.83155835254186,41.723121327706387],[-111.83201579988659,41.722700992509921],[-111.83502483244909,41.721013771929435],[-111.83508500339671,41.719347040232854],[-111.83253015965342,41.719332253159514],[-111.83227326858214,41.718429811344905],[-111.83254247781764,41.71739926163977],[-111.83260827781926,41.710295858947326],[-111.83478913335613,41.710325972300495],[-111.83478493723744,41.709444216231333],[-111.836251385195,41.70944436217718],[-111.83625039266759,41.709275037551791],[-111.83653645377645,41.709273856139227],[-111.83651735655155,41.709840536269006],[-111.83711834098233,41.709838861839778],[-111.83711729617531,41.709480390352958],[-111.83773390177758,41.709478598910934],[-111.83778629427623,41.706477980273959],[-111.83977589449138,41.706506691335896],[-111.83987886924838,41.702782436899312],[-111.84226919044649,41.702857714186727],[-111.84480411467787,41.702594115473161],[-111.84480888780975,41.702775121508743],[-111.84590517805539,41.702696802006152],[-111.84925088602314,41.703311623388011],[-111.84890746584777,41.700229255998273],[-111.85017470573862,41.701727663173713],[-111.85227088182913,41.703193790640192],[-111.85631157482817,41.700200442033541],[-111.85586501070188,41.700148825974686],[-111.86029166612506,41.697196595792526],[-111.86033799715389,41.6927377696836],[-111.86217642733084,41.692725793007938],[-111.86220288082239,41.695876253389763],[-111.86415204273882,41.694433998822262],[-111.86485687490452,41.694570106859189],[-111.86503494908821,41.695752289933083],[-111.86592832952374,41.696504853830888],[-111.86704534771431,41.696458601889873],[-111.86719413941714,41.697425734230166],[-111.8675732790318,41.697468808323954],[-111.86812795383014,41.697249351567812],[-111.86938739666191,41.697247936634476],[-111.87055380989079,41.696764436258071],[-111.87190573287103,41.696759591010164],[-111.87196451229596,41.700132274091416],[-111.86947452569156,41.700147538047823],[-111.86953838394085,41.705154954890567],[-111.86891555849039,41.705227218655033],[-111.86842979454,41.706017202722727],[-111.86712443038236,41.707086284606682],[-111.86653121366899,41.707216857587809],[-111.86599135538646,41.7076514622743],[-111.86592190473364,41.708029379254889],[-111.86514543962929,41.707940654130304],[-111.86294295667254,41.7062882161696],[-111.86138607655876,41.706261166947122],[-111.86061586451795,41.706098506761521],[-111.86062998214834,41.708238466596171],[-111.86032251278506,41.710059283683023],[-111.86013553423899,41.718213819252959],[-111.86268318966705,41.71823345068394],[-111.86262857499938,41.720711683783144],[-111.86495281212049,41.720738345910213],[-111.86508716895837,41.715697021883315],[-111.86783493738957,41.71567630247344],[-111.86782847967389,41.715196278397094],[-111.87010384360964,41.715179071550445],[-111.87006965051056,41.71656550683236],[-111.87028731217909,41.716571064111378],[-111.87025170385739,41.716872167348761],[-111.87550529718345,41.716800734791882],[-111.87534820633488,41.720992883039251],[-111.87131179870531,41.720951505443082],[-111.87126439488723,41.722782084123708],[-111.86503705071203,41.722716546680154],[-111.86496341930247,41.724577043052157],[-111.87479846329738,41.724602564543524],[-111.87480860640557,41.726413790565637],[-111.87997249877789,41.726408586114815],[-111.87974833806437,41.735974801640936],[-111.88812183422586,41.736098628506788],[-111.90185724691345,41.739311600529206],[-111.90189166495085,41.749590952275106],[-111.87913406682009,41.749654755555639],[-111.87924927562493,41.7440830792096],[-111.87415195616141,41.743514905458582],[-111.87409366860528,41.745158216426631],[-111.86906228629245,41.74511261914121],[-111.86898528255442,41.746893875180561],[-111.86398470557552,41.746823504019538],[-111.86397525572546,41.752487141292875],[-111.86154991795748,41.752451312317092],[-111.86142968905345,41.758122079882455],[-111.86389568836252,41.758124279561386],[-111.8638477839974,41.760741152556022],[-111.86557911564854,41.761745904176479],[-111.86656581034897,41.761764586145532],[-111.86650659254073,41.767108838611215],[-111.86346941962945,41.7670641539955],[-111.86351632171983,41.765447960326831],[-111.85616957707562,41.765468719187155],[-111.85612165204755,41.768198172918233],[-111.85835004088104,41.768216672389755],[-111.85831146084749,41.769113148773855],[-111.85373183223192,41.769070713378419],[-111.85359558677827,41.777850760861106],[-111.85632771092052,41.777901582518965],[-111.85593279735606,41.783403236910395],[-111.86106280952092,41.783491897044875],[-111.86106826980235,41.783360355485875],[-111.86586251539458,41.781568876904615],[-111.86718183785997,41.783834967007735],[-111.86778236674188,41.78383763773202],[-111.86777508439702,41.784011525719237],[-111.86590151457385,41.784020259025311],[-111.86243588129518,41.7852883793627],[-111.86247512499997,41.78767761199137],[-111.86736707597623,41.789899705995623],[-111.86728782276052,41.792055650584111],[-111.86424907904173,41.792071347001063],[-111.86424551647148,41.791895739671617],[-111.86343275896253,41.791240746527215],[-111.86249861094632,41.791225246847475],[-111.86248811510116,41.79062186464634],[-111.85665682429489,41.787892278364545],[-111.85519648447419,41.787942789419695],[-111.85068480739257,41.78959122276018],[-111.85042291681486,41.797338628268818],[-111.84628723651744,41.797351337402979],[-111.84643929747681,41.794747499777252]]];
      require([
        "esri/map", "esri/geometry/Polygon", "esri/SpatialReference", "esri/graphic",
        "esri/symbols/SimpleFillSymbol",
        "dojo/domReady!"
      ], function(
        Map, Polygon, SpatialReference, Graphic, SimpleFillSymbol
      ) {
          map = new Map("map", {
              basemap: "topo",
              center: [-111.09, 39.32],
              zoom: 7
          });
          var polygonJSON = {
              "rings": rings,
              "spatialReference": {
                  "wkid": 4326
              }
          };
          poly = new Polygon(polygonJSON);
          map.on("load", function(){
            map.graphics.add(new Graphic(poly, new SimpleFillSymbol()));
          });

      });
    </script>
</head>

<body>
    <body class="tundra">
        <div id="map"></div>
    </body>
</body>

</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Mapping boundary geometry

RobertScheitlin__GISP — Sat, 12 Nov 2016 04:18:08 GMT

Here is a link to the ABCs of AMD:

The abc’s of AMD | ArcGIS Blog

Re: Mapping boundary geometry

DanPatterson_Retired — Sat, 12 Nov 2016 10:05:01 GMT

so much for assuming it was just drawing somewhere else on screen grief!

Re: Mapping boundary geometry

AndrewRousseau — Sat, 12 Nov 2016 23:17:46 GMT

Thanks guys, I really appreciate the help!