Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

107
Views
Leaftlet - Prevent location marker to show up if outside the map boundaries

Here is the scenario: There are about 30 sightseeing places of a european city. The user has the possibility to activate the geolocation feature. The code:

var map = L.map('karte').setView([47.373413911923, 8.5508944440887], 15.5);
        L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    maxZoom: 18,
    id: 'mapbox/streets-v8',
    tileSize: 512,
    zoomOffset: -1,
    accessToken: 'my_token_here'
}).addTo(map);
var node_11 = L.marker([47.37175260846774, 8.551678744507681]).addTo(map);  
node_11.bindPopup('<h3><a href="my_page_here">Page Name</a></h3>');
var node_12 = ...
...

map.locate({setView: true, maxZoom: 18});
function onLocationFound(e) {
    var radius = e.accuracy;

    L.marker(e.latlng).addTo(map)
        .bindPopup("Sie sind innerhalb " + radius + " Meter von diesem Punkt aus");

    L.circle(e.latlng, radius).addTo(map);
}

map.on('locationfound', onLocationFound);

This code can be found on the Leaflet documentation. It works as desired.

Question: Is it possible to preserve the map boundaries (i.e. keep showing the markers) if the user is located outside these boundaries and they have accepted the geolocation request?

I guess some kind of conditional logic is needed, but I'm not that far with my coding skills.

Thanks for any hint!

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!