1

Is there a way to show geojson properties which are located in current bounding box?

something like this http://turbo87.github.io/leaflet-sidebar/examples/listing-markers.html with geojson and its props

  • by bounding box, do you mean visible map extent? – toms Feb 22 '16 at 16:37
1

The following example does just that, using Mapbox.js

https://www.mapbox.com/mapbox.js/example/v1.0.0/listing-markers/

In this case, the properties consist of a title, composed of the markers lat lng coordinates

EDIT
I suppose the downvote was because I didn't copy and paste the example from mapbox. Here it is:

<script>
L.mapbox.accessToken = '<your access token here>';
var map = L.mapbox.map('map', 'mapbox.light');
var myLayer = L.mapbox.featureLayer().addTo(map);
var features = [];

for (var x = -120; x < 120; x += 20) {
    for (var y = -80; y < 80; y += 10) {
        features.push({
            type: 'Feature',
            geometry: {
                type: 'Point',
                coordinates: [x, y]
            },
            properties: {
                'marker-color': '#000',
                'marker-symbol': 'star-stroked',
                title: [x, y].join(',')
            }
        });
    }
}

myLayer.setGeoJSON({
    type: 'FeatureCollection',
    features: features
});

map.on('move', function() {
    // Construct an empty list to fill with onscreen markers.
    var inBounds = [],
    // Get the map bounds - the top-left and bottom-right locations.
        bounds = map.getBounds();

    // For each marker, consider whether it is currently visible by comparing
    // with the current map bounds.
    myLayer.eachLayer(function(marker) {
        if (bounds.contains(marker.getLatLng())) {
            inBounds.push(marker.options.title);
        }
    });

    // Display a list of markers.
    document.getElementById('coordinates').innerHTML = inBounds.join('\n');
});

map.setView([37, -77], 5);
</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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