Make leaflet-marker multiple visible on page load

What was the shortcode you used?

Could you try this?

[leaflet-map fitbounds]
[leaflet-marker address=”new york”]
[leaflet-marker address=”boston”]
[leaflet-marker address=”las vegas”]

All three markers should be visible on your map

Hi @bozdoz
My shortcode look like this below, and trying achieve like this image from github
https://ibb.co/Qfn5tpz

[leaflet-marker lat=33.9239591602259 lng=-115.22666343301536 visible=”true” svg background=”#000080″ iconClass=”fa fa-info-circle””]Location in Here[/leaflet-marker]

[leaflet-marker lat=50.9239591602259 lng=-115.22666343301536 visible=”true” svg background=”#000080″ iconClass=”fa fa-info-circle””]Location in Here[/leaflet-marker]

but only the first visible popup working on page load, it will show on click.
Thank you for the quick response.

• This reply was modified 5 years, 10 months ago by madebymt.

that’s a good point; I’m not actually sure leaflet allows multiple popups to be visible by default.

Check out this option for the leaflet popups: https://leafletjs.com/reference-1.0.0.html#popup-autoclose

Looks like by default all popups auto-close. So only one can be open at a time, by default. I haven’t added anything that could change this option right now. So, if you want I could add it to the list of issues.

@bozdoz Thank you for the resource, I will look into it. Thank you so much for the quick help.

@bozdoz
Sorry one more question, is anyway I can add custom javascript adding new layer from your plugin script? Looking through you github resource form:
Resource: https://github.com/bozdoz/wp-plugin-leaflet-map#frequently-asked-questions

I was trying to avoid load a new script, if plugin already have leaflet script already, and adding new layer script for the popup.
(https://leafletjs.com/download.html)

var popupLocation1 = new L.LatLng(47.52933513746188 ,-120.33553489670159);
var popupLocation2 = new L.LatLng(33.9239591602259,-116.22666343301536);

var popupLocation1 = new L.LatLng(47.52933513746188 ,-120.33553489670159);
var popupLocation2 = new L.LatLng(33.9239591602259,-116.22666343301536);

var popupContent1 = '<p>NEW!<br />popup.</p>',
popup1 = new L.Popup();

popup1.setLatLng(popupLocation1);
popup1.setContent(popupContent1);

var popupContent2 = '<p>SECOND!<br /> popup</p>',
popup2 = new L.Popup();

popup2.setLatLng(popupLocation2);
popup2.setContent(popupContent2);

maps.addLayer(popup1).addLayer(popup2);

Thank you so much!

I don’t really understand the question, but yeah you can add custom javascript, similar to the script found in FAQ on github.

Perhaps you’re looking for

maps[0].addLayer(popup1);

for the first map?

@bozdoz Sorry for the confusion, I’m trying to add new layer from your map plugin, so I can display multiple popup on page load.

Thanks for the help