8

I'm trying to load more than 13 thousand points in leaflet from a geoJson file, everything seems to work just fine except the Popup function. I've looked everywhere for a solution and most answers out here do not work in my case. Here is an excerpt of my code:

//calling the geoJSON    
        var SaoPaulo = L.geoJson(SP_ResSinglePoint, {

            pointToLayer: function (feature, latlng) {
                var popupContent = feature.properties.Time;
                console.log(popupContent);
                return L.circleMarker(latlng, Style(feature)).bindPopup(popupContent);
            },

        });

When I click on a given point I get the following message on the console:

Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

But I do get all the info I'm looking for through the console.log so I'm assuming that that my popup parameters are correct, but yet no luck in the map.

4
  • What type is feature.properties.Time? It seems that the popup content needs to be in string type – Alexandru Pufan Apr 3 '15 at 5:54
  • ... This was exactly the issue! I had no clue that popup could only take string values, does the documentation mention this at all? – Ricardo Oliveira Apr 3 '15 at 13:56
  • @RicardoOliveira The leaflet documentation shows it can take a string, html element, or an already created popup object. – pk. Apr 3 '15 at 14:59
  • 3
    @AlexandruPufan post as answer? – camdenl Apr 3 '15 at 15:59
13

I had the exact same problem and it solved when I concatenated a string to it.

// the number shows correctly itself
console.log(layer.feature.properties.ROWID); // 46

// but bindPopup() won't accept numbers
layer.bindPopup(layer.feature.properties.ROWID); // error

// Then you must convert to string 
layer.bindPopup('quartier ' + layer.feature.properties.ROWID); // working fine

2
  • 1
    This is a nice trick. – Ricardo Oliveira Oct 15 '15 at 14:12
  • 1
    The problem is that it requires the content to be a string, it won't automatically convert it. The proper way is to cast the parameter into a string using String(param) e.g. layer.bindPopup(String(param)); – kyriakos Jun 24 '17 at 16:40

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.