Get coodinate from each point of the polygon on ArcGIS?

584
2
01-09-2022 01:44 AM
RichardSon
New Contributor

I'm working with the ArcGIS API for JavaScript. I wondering is there any features I can use to get the coordinates of each vertex after I draw using the Sketch tool in the ArcGiS API? Update I try to use the webmercator method but it keep appear this error to me

"webMercatorUtils.webMercatorToGeographic is not a function" this is the code i written to parse it.

sketch.on("create", (e: __esri.SketchCreateEvent) => { if (e.state === "complete") { // this.rings = e.graphic.geometry.toJSON().rings.webMercatorUtils.webMercatorToGeographic(); this.rings = webMercatorUtils.webMercatorToGeographic(e.graphic.geometry); } });

0 Kudos
2 Replies
ReneRubalcava
Frequent Contributor

I wrote something that can help with this just recently.

https://www.npmjs.com/package/@odoe/explode

 

const lines = explode(polygon);
const points = lines.map(explode).flat();

 

You are going to get some duplicate points though, because the end vertex for one line is the start vertex for another, so you'll need to do some filtering.

I might be able to add some options to do this in the method in the future, but I didn't need it for what I was doing. 

0 Kudos
SiyabongaKubeka
Occasional Contributor

Hi

 

I once did something like this and here is how you get coordinates of each vertex:

 

sketch.on('create', function (event) {
// check if the create event's state has changed to complete indicating
// the graphic create operation is completed.
if (event.state === "complete") {

if (view.zoom >= 11) {
let gra = event.graphic.clone();
event.graphic.layer.removeAll();
gra.symbol.color = "red";
gra.layer.add(gra);
console.log(view.zoom);
console.log("X = ", gra.geometry.x);
console.log("Y = ", gra.geometry.y);
console.log("Lat = ", event.graphic.geometry.latitude);
console.log("Long = ", event.graphic.geometry.longitude);
lat = event.graphic.geometry.latitude;
lon = event.graphic.geometry.longitude;
zoomLevel = view.zoom;
for (var i = 0; i < gra.geometry.rings.length; i++){
for (var p = 0; p < gra.geometry.rings[i].length; p++){
crmLatitude = String(gra.geometry.getPoint(i, p));
crmLongitude = String(gra.geometry.getPoint(i, p));
var LatLon = String(gra.geometry.rings[i][p]);
console.log(LatLon);
latlon = LatLon;

var graphicsLayer = new GraphicsLayer();

var view = new MapView({
map: webmap,
container: "viewDiv",
popup: null
});


var featureLayer = new FeatureLayer({
url: featureLayerUrl
});

webmap.add(featureLayer);

webmap.layers.add(graphicsLayer);

var sketch = new Sketch({
layer: graphicsLayer,
view: view,
availableCreateTools: ["polygon"],
creationMode: "update",

});



view.ui.add(sketch, {
position: "top-right"
});

var scaleBar = new ScaleBar({
view: view
});
// Add widget to the bottom left corner of the view
view.ui.add(scaleBar, {
position: "bottom-left"
});


sketch.on('create', function (event) {
// check if the create event's state has changed to complete indicating
// the graphic create operation is completed.
if (event.state === "complete") {

if (view.zoom >= 11) {
let gra = event.graphic.clone();
event.graphic.layer.removeAll();
gra.symbol.color = "red";
gra.layer.add(gra);
console.log(view.zoom);
console.log("X = ", gra.geometry.x);
console.log("Y = ", gra.geometry.y);
console.log("Lat = ", event.graphic.geometry.latitude);
console.log("Long = ", event.graphic.geometry.longitude);
lat = event.graphic.geometry.latitude;
lon = event.graphic.geometry.longitude;
zoomLevel = view.zoom;
for (var i = 0; i < gra.geometry.rings.length; i++){
for (var p = 0; p < gra.geometry.rings[i].length; p++){
crmLatitude = String(gra.geometry.getPoint(i, p));
crmLongitude = String(gra.geometry.getPoint(i, p));
var LatLon = String(gra.geometry.rings[i][p]);
console.log(LatLon);
latlon = LatLon;
}
}
debugger;
}
else{
alert("please zoom in");
event.graphic.layer.remove(event.graphic);
}
}

});

0 Kudos