Follow link inside leaflet popup

Viewed 43

I have a leaflet map and the markers on it are obtained using geoJSON. I want to add text from geoJSON to pop-up windows and make it a link. When you click on the link, the link should go to this link. But the transition does not happen, and the error in the console: Uncaught ReferenceError: bindPopup is not defined.Here is my code.

var countiesAll = $.ajax({
            url: "{% url 'api_master_around' id=master.id %}",
            dataType: "json",
            success: console.log("County data successfully loaded countiesAll."),
            error: function (xhr) {
                alert(xhr.statusText)
            }
        })
var map = L.map('map', {
                center: [51.505, -0.09],
                zoom: 14
            })
            setInterval(function () {
                map.invalidateSize();
            }, 100);
            L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {
                foo: 'bar',
                attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
            }).addTo(map);
 L.geoJSON(countiesAll.responseJSON, {
                pointToLayer: function (feature, latlng) {
                    return L.marker(latlng, {icon: iconBlack})
                }
            }).bindPopup(function (layer) {
                var popup = layer.feature.properties.name
                return `<a href = "http://{{ s.myCountry.nameCountry_for_sites_full }}:8000/{{ request.default_lang }}/{{ s.myCity_base }}/{{ z.pk }}"> ${popup} </a> `
            }).addTo(map);
0 Answers
Related