I have an interactive map based on MapBox WebGL. I have an 'on click' function which is returning all information on data layers at that location (lovely). For each object I am trying to pull out just 'layer.id' (layer title) and 'layer.properties'(held as an object) and display that only.
I can't change the geojson so i need to be able to access the properties without knowing what they keys are.
I figured it would just be a case of looping through as an object array but i can't get it right.
Currently this partially works in the console;
map.on('click', function (e) {
map.featuresAt(e.point, {radius: 5, layer: lyrlist}, function (err, features) {
if (err) throw err;
//console.log(features)
var keys = Object.keys(features);
var val = "";
for (var i = 0; i < keys.length; i++) {
val = features[keys[i]];
//console.log(val.layer.id,val.properties); shows layer title and property object in console.
}
//document.getElementById('features').innerHTML = JSON.stringify(features, null, 2); Shows all info in panel.
});
});
link to demo site: http://www.activenaturalist.org.uk/lcren/imap/mb.html