Using leaflet (map maker leaflet)

Support Plugins
1

I am testing the map marker leaflet plugin, and uncortnely I have no map displayed.

I may have missed something, though have tried to follow the readme on the repo.

I am using the admin plugin, so a map-marker-leaflet.yaml was automatically created (I also saved a copy as map-leaflet — referred to in the readme — just in case).

To test, I coped the following from the readme

# London Neighbourhoods [test]
[map-leaflet lat=51.505 lng=-0.09 zoom=13 mapname=neighbourhood style=neighbourhood]
[a-markers markerColor="darkblue"
iconColor="white"]
[{ "lat": 37.7749, "lng": -122.4194, "icon": "home", "title": "Home Position" } ]
[/a-markers]
[a-markers icon=""]
[  { "lat": 51.505,  "lng": -0.09 , "text": 1, "draggable": true  },
{ "lat":  51.515,  "lng": -0.1 , "text": 2, "markerColor": "cadetblue" },
{ "lat":   51.515,  "lng": -0.14, "text": 3, "spin": true },
{ "lat":   51.505,  "lng": 0, "text": 4, "spin": false },
{ "lat":   51.525,  "lng": -0.01, "icon": "coffee", "markerColor": "red", "title": "Lovely bistro"}]
[/a-markers]
[/map-leaflet]

I title is displayed (‘London Neighbourhoods [test]’), but no content… The source for the page has

<div id="neighbourhood" style="width: 100%; height: 530px;"></div>

with no content

followed by (within a script markup

jQuery(document).ready(function () {
    var map = L.map('neighbourhood').setView([51.505, -0.09],13);
    L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors',
        maxZoom: 17
                    }).addTo(map);
    
     L.marker([37.7749,-122.4194], {
        icon: L.AwesomeMarkers.icon({
          markerColor: 'darkblue',
          iconColor: 'white'
                    , icon: 'home'                    })
          , title: "HomePosition"                  }).addTo(map);

    L.marker([51.505,-0.09], {
        icon: L.AwesomeMarkers.icon({
          markerColor: 'blue',
          iconColor: 'white'
                    , icon: '1'          , text: "1"          })
                    , draggable: 1        }).addTo(map);
    L.marker([51.515,-0.1], {
        icon: L.AwesomeMarkers.icon({
          markerColor: 'cadetblue',
          iconColor: 'white'
                    , icon: '1'          , text: "2"          })
                            }).addTo(map);
    L.marker([51.515,-0.14], {
        icon: L.AwesomeMarkers.icon({
          markerColor: 'blue',
          iconColor: 'white'
          , spin: '1'          , icon: '1'          , text: "3"          })
                            }).addTo(map);
    L.marker([51.505,0], {
        icon: L.AwesomeMarkers.icon({
          markerColor: 'blue',
          iconColor: 'white'
                    , icon: '1'          , text: "4"          })
                            }).addTo(map);
    L.marker([51.525,-0.01], {
        icon: L.AwesomeMarkers.icon({
          markerColor: 'red',
          iconColor: 'white'
                    , icon: 'coffee'                    })
          , title: "Lovelybistro"                  }).addTo(map);


});

I have double checked and cache_enable is set to false in the pages md file.

I must be missing something…

2

In roughly about 10 actions I have a lovely Leaflet map of London including a marker with a spinning “3” on it!

Actions:

  1. Installed Leaflet Marker Plugin from Admin Panel (and only that plugin!).
  2. Created a new page and copied the content you posted above into it.
  3. Saved the page.
  4. Visited the page in the frontend.

and voila there it was/is!

Just start over clean. It does work!

3

Thanks. Have tested on vanilla site, and maps show up. Must be theme/skeleton I am using (boxify with inheritance).

4

Hello,

sorry for reviving this topic, but I have an issue with My agency-based theme when trying to install this plugin :

Server Error

Sorry, something went terribly wrong!

### 0 - An exception has been thrown during the rendering of a template ("Failed to read plugins://map-marker-leaflet/map-marker-leaflet.yaml: Duplicate key "tilestanza" detected at line 53 (near "tilestanza: "https://maps.wikimedia.org/osm-intl/{z}/{x}/{y}.png"").").

##### For further details please review your `logs/` folder, or enable displaying of errors in your system configuration.

I just tried it from a fresh agency skeleton and it give the same output !

@finanalyst can you do something about this ?

issue opened on github