I need to form a set of variables according to the following pattern:

var imageUrl = 'http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg'; var imageBounds = [[40.712216, -74.22655], [46.773941, -79.12544]]; 

All the data I need is in a variable in the form of arrays of objects:

[Object, Object, Object, Object, Object]

This is how I iterate over them:

  rasters_previews_list.forEach(function(item) { console.log(item.imageUrl); console.log(item.imageBounds); }); 

The coordinates in the array are stored in my form:

POLYGON((12.562 14.603,8.416 13.653,9.156 9.205,13.294 10.094,12.562 14.603))

I also need just such a format as above.

[40.712216, -74.22655], [46.773941, -79.12544]

Ie the first group, the second is missing and the third group. It should be:

[12.562 14.603], [9.156 9.205]

Those. as a result of traversing a group of objects, I should receive pairs:

imageUrl imageBounds

Each of these pairs I will pass to the function:

L.imageOverlay(imageUrl, imageBounds).addTo(Window.map)

The problem is that I can’t understand how to write an iteration on item.imageBounds to select only the first or third value from there and convert it to the specified form.

    1 answer 1

    Considering that a polygon can be led to an array

     // ES6 syntax const result = rasters_previews_list.map((item) => { const bounds = item.imageBounds.toArray().map((bound, idx) => { if (idx == 0 || idx == 2) { return bound; } }) return { imageUrl: item.imageUrl, imageBounds: bounds } }); // ES5 syntax var result = rasters_previews_list.map(function(item) { var bounds = item.imageBounds.toArray().map(function(bound, idx) { if (idx == 0 || idx == 2) { return bound; } }) return { imageUrl: item.imageUrl, imageBounds: bounds } }); 

    Given that the polygon is a string

      // ES5 syntax var result = rasters_previews_list.map(function(item) { var bounds = item.imageBounds.substring(imageBounds.lastIndexOf('(') + 1, imageBounds.indexOf(')') - 1).split(',').map(function(bound, idx) { if (idx == 0 || idx == 2) { return bound.split(' ').map(function(value) { return parseFloat(value) }); } }); return { imageUrl: item.imageUrl, imageBounds: bounds }; }); console.log(result); //Вывод результата result.forEach(function(item) { L.imageOverlay(item.imageUrl, item.imageBounds).addTo(Window.map) } ); 
    • Do I understand correctly that in the last example in the last line, we are already transmitting everything to the map element itself? At what point can the output be made to look at what is transmitted by the eyes? - Dmitry Bubnenkov
    • Updated the last example - Nick Poteryaev