[GIS] Displaying images in marker popup fails

leafletmarkerspopup

I would like to display images in a marker popup but I get the following error:

enter image description here

The image does display when I write:

var picURL2 = 'http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
    imageBounds = [
        [55.1, 11.6],
        [55.0, 11.74644]
    ];
L.imageOverlay(imageUrl, imageBounds).addTo(map);

But when I try to add it in a marker popup like so:

var picURL2 = 'http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg';

shelter1.bindPopup("<img src=" + picURL2 + "/>");

, I get the 404 error.

Best Answer

You just need to add extra quotes around the src value:

shelter1.bindPopup("<img src='" + picURL2 + "'/>");

(note the single quotes ' before and after the closing/opening string double quotes ")

Live demo: https://plnkr.co/edit/QxqvzaIgmONlCo0jirHy?p=preview