Somos bastante nuevos con JavaScript y OpenLayers y estamos un poco luchando. En la función addInteraction(), permitimos que los usuarios dibujen características (usando polígonos, círculos, etc.). En nuestra aplicación web actual, los usuarios pueden dibujar fácilmente esas características y pueden dibujar múltiples características.
let draw; // global so we can remove it later function addInteraction() { const value = typeSelect.value; if (value !== 'None') { draw = new ol.interaction.Draw({ source: source, type: typeSelect.value, }); map.addInteraction(draw); } }Esto funciona bien. Ahora, queremos agregar ID a las características recién dibujadas:
let draw; // global so we can remove it later function addInteraction() { const value = typeSelect.value; if (value !== 'None') { draw = new ol.interaction.Draw({ source: source, type: typeSelect.value, }); draw.on('drawend', function(event) { var id = uid(); // create a unique id // it is later needed to delete features event.feature.setId(id); // give the feature this id }); map.addInteraction(draw); } }Sin embargo, ahora solo podemos dibujar una característica. Después de eso, cada vez que intente dibujar una nueva característica, se eliminará sola. Y mucho menos, no sabemos cómo recuperar la identificación.
La función uid():
// creates unique id's function uid(){ var id = 0; return function() { if (arguments[0] === 0) { id = 0; } return id++; } }¿Por qué es esto y cómo se puede solucionar?
Su función uid devuelve otra función, por lo que siempre establece la ID de su función en esa función, por lo tanto, sus funciones siempre obtienen la misma ID.
Puede confirmar esto fácilmente registrando en la consola el ID generado, mostrará que es una función y no un número.
Para obtener el comportamiento deseado, primero debe llamar a la función uid() para obtener la función devuelta, como esta:
var counterFunction = uid() draw.on('drawend', function(event) { var id = counterFunction(); event.feature.setId(id); }); la recuperación de ID funciona a través de feature.getId() .