leaflet.table

KO | EN

gitlite — search

#python #llm #go #android #machine-learning #rust #deep-learning #linux #docker #awesome #awesome-list #pytorch #openai #open-source

(★ 9)

Leaflet data table

leaflet.table Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Leaflet table

To display a data table inside a leaflet map.

[Check it out](http://diogok.github.io/leaflet.table).

## Usage

Use the leaflet CSS and JS

Include the CSS and JS:

Create the map:

Use the table control:

var table_control = new L.control.Table({}).addTo(map);

var fields = ['id','name'];

var layer = new L.layerGroup();

for(var i=0;i<50;i++) { // random points
      var marker = new L.marker([10.0+(i/100), 20.0+(i/100)]);
      marker.properties={id:i,name:"John "+i};
      marker.bindPopup('ID: '+marker.properties.id);
    }

var data= layer.getFeatures().map(function(feat){return feat.properties});

var table = new Supagrid({
      fields: fields,
      id_field: fields[0],
      data: data
    });

layer.eachLayer(function(layer){
      layer.on('popupopen',function(){
        table.focus(layer.properties.id);
      });
    });

table_control.addTable(table.supagrid,'my_table','My Table')

Take a look at the index.html for other usage.

## License

MIT

leaflet.table

leaflet.table Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

leaflet.table

leaflet.table Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README