How to draw a polygon using coordinates stored in the array?

[SiyabongaKubeka]

Hi All,

I have an array that contains coordinates, I want to use those coordinates to draw a polygon, how can I do that?

var myArr = [3364047.4454315286,-3228904.4514530962,

3364900.9929277417,-3228484.0477610803,

3365799.1274269233,-3229152.871795023,

3365206.741040882,-3229535.056936448,

3364047.4454315286,-3228904.4514530962];

I want to manipulate the contents of the above array to be something like this so that I can be able to draw the polygon:

const vertices = [
[3364047.4454315286, -3228904.4514530962],
[3364900.9929277417, -3228484.0477610803],
[3365799.1274269233, -3229152.871795023],
[3365206.741040882,-3229535.056936448],
[3364047.4454315286,-3228904.4514530962]
];

I am using JavaScript, I want to draw a polygon on an Esri map.

Kind Regards

Siyabonga Kubeka

[RobertScheitlin__GISP · Accepted solution]

3.x

let poly = new Polygon(vertices);‍‍

4.x

const polygon = new Polygon({
  rings: vertices,
  spatialReference: { wkid: 102100 }
});‍‍‍‍‍‍‍‍‍‍

[SiyabongaKubeka]

Hi Robert,

Thank you very much. I have used the following way and it worked:

var zLatitude = window.parent.Xrm.Page.getAttribute("dea_latitude").getValue();
var zLongitude = window.parent.Xrm.Page.getAttribute("dea_longitude").getValue();


var latitudes = zLatitude.split(',');
var longitudes = zLongitude.split(',');

var myArrayLat = [];
var myArrayLon = [];
var coordinates = [];



//Getting the latitudes
debugger;
for(i = 0; i < latitudes.length; i++)
{
myArrayLat.push(latitudes);

}

//Converting to clean latitudes

var x = 0;
var xlen = myArrayLat.length;
while(x < xlen){
myArrayLat = parseFloat(myArrayLat);
x++
}

//Getting the longitudes
for(j = 0; j < longitudes.length; j++)
{
myArrayLon.push(longitudes);
}

//Converting to clean longitudes
var y = 0;
var ylen = myArrayLon.length;
while(y < ylen){
myArrayLon = parseFloat(myArrayLon);
y++
}


console.log(myArrayLat);
console.log(myArrayLon);

for (var i=0; i<myArrayLon.length && i< myArrayLat.length; i++)
{
coordinates = [myArrayLon, myArrayLat];

}
console.log(coordinates);

var zoomed =[];

zoomed = coordinates[0];
var zoomed1 = zoomed[0];
var zoomed2 = zoomed[1];

console.log(zoomed1);
console.log(zoomed2);

Then I did the following:

function addGraphics() {
debugger;
const vertices = [coordinates];

const polygon = createGeometry(vertices);
validSymbol = createSymbol([0, 170, 255, 0.8], "solid", 2, [
255,
121,
5
]);
newDevelopmentGraphic = new Graphic({
geometry: webMercatorUtils.geographicToWebMercator(polygon),
symbol: validSymbol,
attributes: {
newDevelopment: "new store"
}
});
graphicsLayer.add(newDevelopmentGraphic);
}