0

I haven't looked at the page for a while but it was working a couple months back. Now when I go there I can see my popup with text in it and the map container as well as the + and - signs. Basically everything is there except the actual map! It is just a grey background. Any ideas?

I am using the latest version css and js from can

https://unpkg.com/leaflet@1.7.1/dist/leaflet.css
https://unpkg.com/leaflet@1.7.1/dist/leaflet.js

some basic map code

    var map = L.map('testmap').setView([51.505, -0.09], 13);

    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);

    L.marker([51.5, -0.09]).addTo(map)
    .bindPopup('A pretty CSS3 popup.<br> Easily customizable.')
    .openPopup();

enter image description here

Waterfall
  • 584
  • 1
  • 5
  • 15
  • Is this your code or the code from a sample? If you using mapbox tiles look at: https://stackoverflow.com/a/64262141/8283938 – Falke Design Apr 08 '21 at 12:30
  • It is sample code that I am trying on a blank page. Trying to see if I can even get it to work in its most basic form. – Waterfall Apr 08 '21 at 12:31
  • Did you add the height on the element? in this case 'testmap' – Stephan Oomen Apr 08 '21 at 12:32
  • @StephanOomen yeah, `
    `. I added a screenshot to my original question     – Waterfall Apr 08 '21 at 12:33
  • Are you seeing the tiles here: https://leafletjs.com/index.html – Falke Design Apr 08 '21 at 12:43
  • @FalkeDesign yes I can see that. Interestingly enough, I tried to view my test page in Safari and it works. But in Google Chrome is where I am experiencing the issue. The link you sent me works in google chrome though so I am not sure what is going on. – Waterfall Apr 08 '21 at 12:50
  • Another thing, it works on my localhost but not on live server. I have tried 2 different linux servers. – Waterfall Apr 08 '21 at 12:59
  • Use the [network monitor in your browser's developer tools](https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor) to check if the OSM tiles are being requested, and/or if there are any network or HTTP errors. – IvanSanchez Apr 08 '21 at 13:10

0 Answers0