Displaying Points on Different Projections

2077
14
02-03-2017 11:15 AM
DianeJorgensen
New Contributor

I'm trying to do something very simple and can not seem to figure out what the problem is.  I have a REST service that retrieves locations with decimal lat/long's.  I want to add a point to a map for each of these locations.  As long as the spatial reference is 4326, everything is fine.  If I try to add points in any other spatial reference, they are added incorrectly.  Specifically, I am trying to add points to a 102021 projection (Antarctica).  Even when I set the map's spatial reference to 102021 and use a layer whose projection is defined as 102021, and specify 102021 as the spatial reference in my Point constructor, the points are not added to the correct locations.  Through various attempts, I have been able to get the correct projection with the wrong points, the correct points on the wrong projection, and the wrong projection with the wrong points.  All other resources have shown this to be a fairly easy task, but I am at a loss as to why this isn't working, and any help would be greatly appreciated.  Code snippet below.

var map;

require([
"esri/geometry/Point",
"esri/geometry/Extent",
"esri/tasks/GeometryService",
"esri/tasks/ProjectParameters",
"esri/SpatialReference",
"esri/symbols/SimpleMarkerSymbol",
"esri/graphic",
"esri/Color",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/layers/ArcGISTiledMapServiceLayer",
"esri/map",
"dojo/parser",
"dojo/request/xhr",
"dojo/_base/array",
"esri/geometry/webMercatorUtils",
"dojo/domReady!",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane"], 
function(Point, Extent, GeometryService, ProjectParameters, SpatialReference, SimpleMarkerSymbol, Graphic, Color, ArcGISDynamicMapServiceLayer, 
 ArcGISTiledMapServiceLayer, Map, parser, xhr, Array, webMercUtils)
{
 gsvc = new GeometryService("https://utility.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
 params = new ProjectParameters();

 
 // a map layer defined as 102021
 var antarcLayer = new ArcGISDynamicMapServiceLayer("https://gis.icao.int/ArcGIS/rest/services/ANTARCTIC/MapServer");
 var symbol = new SimpleMarkerSymbol();
 symbol.setColor(new Color("#00FFFF"));

 parser.parse();
 
 // coords are passed in
 map = new Map("mapDiv", {
   extent: new Extent({
   xmin: <%=minX%>,
   ymin: <%=minY%>,
   xmax: <%=maxX%>,
   ymax: <%=maxY%>,
   spatialReference:{wkid: 102021}
   })
 });
 map.addLayer(antarcLayer);
 
// I have tried webMercatorUtils to convert from geometry to mercator and back and lat/long to xy and back, and these do not work either
// I have also tried using Geometry Service "project" 
map.on("load",function(){
   xhr("<rest_url>", { 
   method: "GET",
   handleAs: "json"
   }).then(function(jsonData){
     Array.forEach(jsonData, function(entry,i){
     console.log(entry.platformId + "," + entry.latitude + "," + entry.longitude + " at index " + i );
     var pt = new Point(entry.longitude, entry.latitude, new SpatialReference(102021));
     map.graphics.add(new Graphic(pt, symbol));
     });
   });
 });
});

</script>
<body class="claro">
 <div id="mapDiv"></div>
</body>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍
0 Kudos
14 Replies
RebeccaStrauch__GISP
MVP Emeritus

What basemap are you using and is it the same wkid? 

tagging https://community.esri.com/community/developers/web-developers/arcgis-api-for-javascript?sr=search&s...‌ to get more exposure.  The "Developers" space is a bit too generic.

0 Kudos
DianeJorgensen
New Contributor

I'm actually not specifying a basemap.  The layer is being added to an empty map. Is a basemap necessary, or is one provided by default (with a potentially incorrect wkid) if I don't specify one?  Also, I can't seem to find an esri basemap with wkid 102021.  Everything I've found is either 4326 or 3857.

0 Kudos
thejuskambi
Occasional Contributor III

Can you please share the result of the line

console.log(entry.platformId + "," + entry.latitude + "," + entry.longitude 
+ " at index " + i );

0 Kudos
DianeJorgensen
New Contributor

NZCH,-43.4892,172.5322 at index 0

NZAA,-37.0081,174.7917 at index 1

NZIR,-77.8539,166.4686 at index 2

0 Kudos
thejuskambi
Occasional Contributor III

It looks like Melita Kennedy‌ is correct, the coordinates you have shared looks to be in 4326.

While creating the point do not pass the spatial-reference parameter, it will initialize it in 4326. Then you can use the GeometryService or webMercatorUtils to project the geometry to 102021 system.

DianeJorgensen
New Contributor

I've updated the load function to look like this (rest of the code is the same):

map.on("load",function(){
 console.log(map.extent);
 xhr("<rest_url>", { 
 method: "GET",
 handleAs: "json"
 }).then(function(jsonData){
   Array.forEach(jsonData, function(entry,i){
   console.log(entry.platformId + "," + entry.latitude + "," + entry.longitude + " at index " + i );
   var pt = new Point(webMercUtils.lngLatToXY(entry.longitude, entry.latitude));

   if (webMercUtils.canProject(pt, map))
   {
     webMercUtils.project(pt, map);
   }
 }
 });
 });
 });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

canProject evaluates to true, but then an error is thrown on the project method.  "TypeError: d.equals is not a function" at Object.project (init.js:860).  If I change the call to

webMercUtils.project(new Graphic(pt, new SimpleMarkerSymbol()), map);

then there are no errors, but no points display at all.

0 Kudos
thejuskambi
Occasional Contributor III

I am not sure, why you are using

webMercUtils.lngLatToXY(entry.longitude, entry.latitude)

This method returns Number[ ] and the Point class constructor does not take number array a parameter. whereas, lat & long is a valid parameter, you can simply create a new point like this

var pt = new Point(entry.longitude, entry.latitude);

Hope this was helpful.

0 Kudos
DianeJorgensen
New Contributor

I appreciate the time you're taking to help.  However, when I do this, canProject returns false and I get no points.

0 Kudos
thejuskambi
Occasional Contributor III

That only means that you cannot project it using webMercatorUtils. You may have to use the GeometryService to get the result.

0 Kudos