More than one GeoJSON popup_property

That might be a hard one (but might not).

I like the idea of string formatting as you suggest; maybe something like:

[leaflet-geojson]
{title}
[/leaflet-geojson]

You could do something like that in leaflet-map/shortcodes/class.geojson-shortcode.php

The function reads like this:

function onEachFeature (feature, layer) {
    var props = feature.properties || {},
        text = popup_property && props[ popup_property ] || popup_text;
    if (text) {
        layer.bindPopup( text );
    }
}

Leaflet actually has a function to interpolate strings, called L.Util.template. So you should be able to change the function like this:

function onEachFeature (feature, layer) {
    var props = feature.properties || {},
        text = popup_property && props[ popup_property ] || popup_text;
    if (text) {
        text = L.Util.template(text, props);
        layer.bindPopup( text );
    }
}

It might be THAT easy to hack! Give it a shot if you’re keen to be the first. That should be backwards compatible, so I’ll look into adding it into the next version. Thanks!

Wow, that markup really messed up my comment. Here was my suggested markup:

[leaflet-geojson]
<a href={url}>{title}</a>
[/leaflet-geojson]

Actually, I wouldn’t want to use L.Util.template. It throws an Error, which I think is needless. Here’s my recommended function:

var templateRe = /\{ *([\w_-]+) *\}/g;
function template(str, data) {
	return str.replace(templateRe, function (match, key) {
		var value = data[key];
		if (value === undefined) {
			return match;
		}
		return value;
	});
}

• This reply was modified 7 years, 1 month ago by bozdoz.

Great shot @bozdoz, your proposal works perfect adding the template function and changing line 109 of leaflet-map/shortcodes/class.geojson-shortcode.php to:

text = popup_property && props[ popup_property ] || template(popup_text, feature.properties);

Thanks!

ps: just created a pull request

There is a final detail with the generated popup markup. Probably it’s an issue with layer.bindPopup( text ). I’m adding more HTML markup to the geojson shortcode, like this:

[leaflet-geojson]<h3><a href="https://xrcb.exo.cat/?p={id}">{title}</a></h3>{barrio}<br>Radio {categoria}[/leaflet-geojson]

It get’s converted to something like that, with a lot of extra <p> and <br>:

<div class="leaflet-popup-content"><p></p><br><h3><a href="https://xrcb.exo.cat/?p=22">scannerfm.com</a></h3><br><p>el Poble Sec<br>Radio libre</p></div>

Probably WordPress is reading the new lines:

[leaflet-geojson]
*new line*
*new line
[/leaflet-geojson]

WordPress creates paragraphs for every new line. Try putting it on one line? Or try the text editor instead of the visual editor? Other than that it’s working?

Something like this:

[leaflet-geojson]All text here[\leaflet-geojson]

• This reply was modified 7 years, 1 month ago by bozdoz.

Actually I have it in one line in the text tab, exactly as I posted it in the last message. Seems that WordPress is doing some HTML cleanup before saving it to the database.

• This reply was modified 7 years, 1 month ago by Gerald.

Hmmm. I just gave it a test and it works great! Not seeing any extra para tags at all. Not sure what might be happening.

This is behind my coding knowledge. I just need to show more properties in a single popup. What would look the shortcode like? Do I need to modify any php code of the plugin? If yes can I achive this using Code Snippets plugin which I broadly use? Thanks, Roman.

I’ve resolved it, sorry for replying to a resolved topic.