Положение иконки в Leaflet Easy Button - PullRequest
Новая
       52

Положение иконки в Leaflet Easy Button

0 голосов
/ 17 мая 2019

Я использую простую кнопку Leaflet на своей карте Leaflet: 

<!-- Load LeafletEasyButton -->  
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet-easybutton@2/src/easy-button.css">
<script src="https://cdn.jsdelivr.net/npm/leaflet-easybutton@2/src/easy-button.js"></script>

Я также использую значки материалов Google: 

<!-- Load Google Material Icons -->
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

Цель состоит в том, чтобы создать пользовательскую кнопку на моей карте листовки следующим образом: 

L.easyButton('<i class="material-icons" style="font-size:18px;">gps_fixed</i>', function(){
    locateMe();
}, {position: 'bottomright'}).addTo(map);

Это работает, но значок в моей пользовательской кнопке расположен над центром кнопки:

enter image description here

Как я могу расположить значок по центру?

1 Ответ

1 голос
/ 17 мая 2019

Вы можете использовать left / top в коде css: 

 .widget-code {
    display: block;
    height: 18px;
    left: 6px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 6px;
    width: 18px;
}
...