Leaflet Custom Control position: center

leaflet

Solution

Adding a custom control on a map on leaflet is performed like this:

For instance a logo:

    var logo= L.control({
        position : 'topleft'
    });
    logo.onAdd = function(map) {
        this._div = L.DomUtil.create('div', 'myControl');
        var img_log = "<div class="myClass"><img src=\"images/logo.png\"></img></div>";
    
        this._div.innerHTML = img_log;
        return this._div;
    
    }
    logo.addTo(map);

Then you can add CSS styling to myClass to center it: (this part has not been tested by myself)

    .myClass {
       padding-top:50%;
       padding-left: 50%;
    }

Problem

we are hooking up an eye-tracker to control the leaflet map (pan, zoom etc.) We would like to have a custom control that appears at the center of the map (for menu functions) Currently Leaflet does not support position: 'center') (topleft, etc. is supported) ideas?

Original source

Related problems