Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I have just little knowledge about HTML and JavaScript. Nevertheless I was playing, copying and pasting around with Leaflet and CartoDB.

I want to display the features GeoJson in a table. This is what I tried.

var map ='map').setView([51.0, 10.0], 6);

var base = {
"S/W" : L.TileLayer.provider('OpenStreetMap.BlackAndWhite'),
"TOP":  L.TileLayer.provider('Thunderforest.OpenCycleMap'),
"OpenStreetMap": L.TileLayer.provider('OpenStreetMap.Mapnik')

window.backupAlert = window.alert;
window.alert = function () {return true};
var alle = L.cartoDB(' * FROM jobsnew', {
pointToLayer: function(feature, latlng) {
return L.marker(latlng, {
icon: L.icon({
iconSize: [4, 4],
iconAnchor: [0, 0],
popupAnchor: [0, 0],
iconUrl: ""
 onEachFeature: function(feature, layer) {
layer.bindPopup('<strong>' + + '</strong><br>' +;


map.on( "zoomend", function( e ) {
    console.log( "zoom level is " + map.getZoom())
}); //zur ausgabe des Zoomlevels in der Konsole
var layersControl = L.control.layers(base,alle); 
for (var key in alle._layers) {
  if (alle._layers.hasOwnProperty(key)) {
    backupAlert("hi comment");
function writeTable() {
    var out = '';
    for (var row=0; row<1000; row++) {
    if ( typeof(alle._layers[row])=='undefined') continue;
        out += '<tr>' 
        + '<td>' + alle._layers[row] + '</td>' + 
        + '<td>' + alle._layers[row] + '</td>' 
        + '</tr>'

This somehow works but there are some issues. The main problem is that the indices in the alle are not starting at 0 and they are not increasing by the step size of 1.

share|improve this question
up vote 3 down vote accepted

You can loop over a L.LayerGroup using eachLayer in Leaflet. A L.cartoDB object is a specialized L.GeoJSON object which in turn is a specialized layer group.

Each feature, a geometry, in stored in a layer. The properties you want to display can be fetched from the features of the layers we are looping over.

var out = '';
    out += '<tr>';
    out += '    <td>' + + '</td>';
    out += '    <td>' +    + '</td>';
    out += '</tr>';

But notice that creating the L.cartoDB object takes some time for the database query. And since this is done asynchronously, you have to wait for the result in code.

Sadly, as far as I found out, there is no way to pass a callback to handle the result as it returns. Here is a short lineup how to perform the task without the help of CartoDB. I am not going to explain this in more detail since it goes beyond the actual question and you would need to dig into technologies like JavaScript, PHP, SQL, GeoJSON and AJAX first.

  • use a JavaScript framework like jQuery for the AJAX request which allows you to specify a callback function to process the data as it returns
  • use a server side language like PHP to connect to the database, query the data from it, encode it to GeoJSON and output that
  • in the JavaSCript callback do both, create a Leaflet GeoJSON layer to display the result on the map, and loop over the GeoJSON object to append rows for each feature to the table
share|improve this answer
i've tried some timeout statements. but they didn't worked properly. can you describe a possibility to solve the asynchronous loading problem?! – Riccardo Jun 6 '13 at 8:01
The best solution would be to execute a callback function which inserts the results after the result arrived. For example, the jQuery framework lets you specify such a callback function for AJAX requests. – danijar Jun 6 '13 at 8:04

A bit hacky but effective, each_layer_fn);

I use this in a special case of a KML layer what is FeatureGroups inside FeatureGroups, to found the polygons inside I use the following function

var each_layer_fn = function(layer) {
    if(typeof(layer._layers) === 'undefined') {
        // do da thing
    } else, each_layer_fn);        



share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.