0

I've set up a small example of an OpenLayers 3 map, and I am trying to add a custom polygon to the map. If I use the data from the example, it works correctly, the polygon renders, and it is shown on the map, but when I try to add another custom polygon, it is not showing up on the map at all. Here's the code I use:

function initMap(map) {

 var IMap=new Map(map, [50.5973695, 6.200000]);
 var polygons=jQuery("#"+map).data('polygons');
 console.log(polygons);
 jQuery.each(polygons, function(index, value) {
     IMap.addPolygon(index, value);
 });

 IMap.addPolygon('test', [[-12.55,-21.12], [-44,-55], [-88,75]]);
}

Function Map works correctly, as the map is rendered, and centered to the specific position. Function addPolygon also works, because the polygon which I add manually with the IMap.addPolygon line renders on the map. Here is the Map::addPolygon function:

Map.prototype.addPolygon = function(name, coordinates) {

 var _coordinates=[], i;
 for (i=0; i<coordinates.length ;i++ ) {
     console.log(coordinates[i]);
     _coordinates.push(ol.proj.transform(coordinates[i], 'EPSG:4326', 'EPSG:3857'));
 }

 console.log("Creating polygon", _coordinates);
 var Polygon = new ol.geom.Polygon([_coordinates]);
 var feature = new ol.Feature({
     name: name,
     geometry: Polygon
 });
 this.polygons.push(feature);

 feature.setStyle(polyStyle);

 this.vectorSource.addFeature(feature);
}

Here is the two _coordinates which is logged out:

This one is for the dynamicaly creted polygon, which is not rendering:
Creating polygon Array [ Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], 9 more… ]
Inner array example from above array: Array [ 50.5982266, 6.2467439 ]

This one is for the manually added polygon, which renders correclty:
Creating polygon Array [ Array[2], Array[2], Array[2] ]
Inner array example from above array: Array [ -13.12, -21.76 ]

What could be the problem?

NOTE: This question was also posted on stackoverflow.com.

4
  • Can you post the example that this is based on please?
    – karpfen
    Jul 4 '16 at 13:37
  • If addPolygon works correctly, the problem is in the result of the jQuery call. Typical problem with manual geometry management in OL3 is having an array of coordinates with incorrect nesting level (number of dimensions). Jul 4 '16 at 16:10
  • Strangely, if I change the order in my generated array, to LON-LAT instead of LAT-LON, the polygon displays. Is the order in the Polygon class inversed? Jul 5 '16 at 11:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.