Is there a way to get the new coordinates of the modified polygon in openlayers?

Question

I am giving the map a four coordinates that makes up a polygon:

var x_1 = 28.0244307;
var y_1 = -25.8635238;

var x_2 = 28.0244307;
var y_2 = -25.8835238;

var x_3 = 28.0444307;
var y_3 = -25.8835238;

var x_4 = 28.0444307;
var y_4 = -25.8635238;

So when I am enabling functions so that I can modify the existing polygon, there should obviously be new coordinates for the modified polygon, how can I get the new coordinates of the modified polygon?

var coords = [
                [x_1, y_1],
                [x_2, y_2],
                [x_3, y_3],
                [x_4, y_4],
                [x_1, y_1]
            ];

var polygon = new ol.geom.Polygon([coords]);

var feature = new ol.Feature(polygon);

    polygon.transform('EPSG:4326', 'EPSG:3857');

var vectorSource = this.vectorSource;
    vectorSource.addFeature(feature);

var select = new ol.interaction.Select();

var modify = new ol.interaction.Modify({
    features: select.getFeatures(),
   });

 var snap = new ol.interaction.Snap({
     source: vectorSource,
    });

 this.map.addInteraction(select);
 this.map.addInteraction(modify);
 this.map.addInteraction(snap);

score 0 · Answer 1 · answered Nov 13 '20 at 14:19

0

You can do something like this:

feature.getGeometry().getCoordinates();

answered Nov 13 '20 at 14:19

user11260787

167
6

score 0 · Answer 2 · answered Nov 14 '20 at 16:39

When the modifyend event fires get the coordinates of the feature.

  modify.on('modifyend', function (evt) {
    console.log("modify end");
    var i=0;
    evt.features.forEach(function (feature) {
       console.log(i+":"+feature.getGeometry().getCoordinates());
       i++;
    });
  });

outputs this to the console when I modify the polygon:

modify end
0:3119665.3552953834,-2982187.576923644,3116995.620270418,-2985977.4637464806,3121891.745111249,-2984662.004550239,3121891.745111249,-2982187.576923644,3119665.3552953834,-2982187.576923644

proof of concept fiddle

var raster = new ol.layer.Tile({ // TileLayer({
  source: new ol.source.OSM()
});

var vector = new ol.layer.Vector({ // VectorLayer({
  source: new ol.source.Vector() // VectorSource({
});

//
var x_1 = 28.0244307;
var y_1 = -25.8635238;

var x_2 = 28.0244307;
var y_2 = -25.8835238;

var x_3 = 28.0444307;
var y_3 = -25.8835238;

var x_4 = 28.0444307;
var y_4 = -25.8635238;

var coords = [
  [x_1, y_1],
  [x_2, y_2],
  [x_3, y_3],
  [x_4, y_4],
  [x_1, y_1]
];

var polygon = new ol.geom.Polygon([coords]);

var feature = new ol.Feature(polygon);

polygon.transform('EPSG:4326', 'EPSG:3857');

var vectorSource = vector.getSource();
vectorSource.addFeature(feature);

var select = new ol.interaction.Select();

var modify = new ol.interaction.Modify({
  features: select.getFeatures(),
});

var snap = new ol.interaction.Snap({
  source: vectorSource,
});

var map = new ol.Map({
  interactions: ol.interaction.defaults().extend([select, modify, snap]),
  layers: [raster, vector],
  target: 'map',
  view: new ol.View({
    center: ol.proj.fromLonLat([28.024, -25.87]),
    zoom: 12
  })
});
modify.on('modifyend', function(evt) {
  console.log("modify end");
  var i = 0;
  evt.features.forEach(function(feature) {
    console.log(i + ":" + feature.getGeometry().getCoordinates());
    i++;
  });
});


select.on('change', function() {
  console.log("select change");
});

html,
body {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
}

.map {
  height: 95%;
  width: 100%;
}

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/css/ol.css" type="text/css">
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
<script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/build/ol.js"></script>
<div id="map" class="map"></div>

It seems okay, but i have one problem, it seems like when for example putting in that coordinates in a coordinate finder, it is not that exact coordinates where the polygon is, any reason why? — Ben Collins, Nov 16 '20 at 07:03
That may be a different question. You will need to provide more details than that. Where are the coordinates you are retrieving? What are the coordinates of the original polygon? Are you accounting for the projection? — geocodezip, Nov 16 '20 at 13:45

Is there a way to get the new coordinates of the modified polygon in openlayers?

2 Answers2