Skip to content

Instantly share code, notes, and snippets.

@dbauszus-glx
Created June 15, 2019 15:35
Show Gist options
  • Save dbauszus-glx/d3541df4d52b4a403a2fdd66c89e7895 to your computer and use it in GitHub Desktop.
Save dbauszus-glx/d3541df4d52b4a403a2fdd66c89e7895 to your computer and use it in GitHub Desktop.
Select a feature at pixel from XYZ endpoint with OpenLayers
let currentFeature;
map.on('click', select);
function select(e) {
sourceVector.clear();
map.removeInteraction(drawInteraction);
map.removeInteraction(modifyInteraction);
btnDelete.classList.remove('active');
const features = map.getFeaturesAtPixel(e.pixel);
if (!features) return;
currentFeature = features[0];
const location = {
id: features[0].getProperties().id
};
const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://geolytix.xyz/dev/api/location/select/id?locale=GB&layer=Scratch&table=dev.scratch&id=' + location.id);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.responseType = 'json';
xhr.onload = e => {
if (e.target.status !== 200) return;
location.type = 'Feature';
location.geometry = e.target.response.geomj;
let feature = geoJSON.readFeature(location);
feature.getGeometry().transform('EPSG:4326', 'EPSG:3857');
feature.set('id', location.id);
sourceVector.addFeature(feature);
map.addInteraction(modifyInteraction);
btnDelete.classList.add('active');
};
xhr.send();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment