Как я могу центрировать карту листовки в браузере? - PullRequest
Новая
       17

Как я могу центрировать карту листовки в браузере?

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

Я создаю игровую карту с помощью листовки, и пока все работает нормально, кроме центрирования карты.Я хотел бы, чтобы карта была вертикально центрирована в браузере.

Есть ли способ исправить это?

Я пытался изменить L.latLng в разделе // Объявление объекта карты, но это не сработало.

Вот как янастроить его в данный момент: 

// Variables
var mapSW = [608, 8026],
    mapNE = [7574, 146];

// Declare Map Object
var map = L.map('map', {
    center: L.latLng(0, 0),
    zoom: 4
});

// Reference the tiles
L.tileLayer('maps/velen/{z}/{x}/{y}.png', {
    minZoom: 2,
    maxZoom: 5,
    continuousWorld: false,
noWrap: true,
    crs: L.CRS.Simple,
}).addTo(map);

map.setMaxBounds(new L.LatLngBounds(
    map.unproject(mapSW, map.getMaxZoom()), 
    map.unproject(mapNE, map.getMaxZoom())
));

// Icons
    var locat = L.icon({
        iconUrl: 'images/locat_marker.png',
        iconSize: [24, 30],
        iconAnchor: [5, 30],
        popupAnchor: [5, 44],
});

var quest_marker_lvl1 = L.icon({
        iconUrl: 'images/quest_marker_lvl_0.png',
        iconSize: [67, 39],
        iconAnchor: [5, 39],
        popupAnchor: [0, -39],
    });

// Markers and Popups
// LatLng
    var refmarker = L.marker([0, 0], {
        draggable: true,
    }).addTo(map);
refmarker.bindPopup('');

refmarker.on('dragend', function(e) {
    refmarker.getPopup().setContent('Clicked ' +                                 
refmarker.getLatLng().toString() + '<br />'
     + 'Pixels ' +map.project(refmarker.getLatLng(), 
map.getMaxZoom().toString()))
    .openOn(map);
});

// Pixels
// Locations
var popupContent = "Hanged Man's Tree";
var popupOptions =
    {
        autoClose: false,
closeOnClick: false,
     closeButton : false,
      'className' : 'locat_marker' // classname for another popup
}
var locat_hanged_mans_tree = L.marker(map.unproject([2172, 1924], 
map.getMaxZoom()), {icon: locat})
.bindPopup(popupContent, popupOptions).addTo(map).openPopup();

// Quests lvl 1
var quest_fake_pass = L.marker(map.unproject([2033, 1693], 
map.getMaxZoom()), {icon: quest_marker_lvl1})
    .bindPopup("Fake Pass");

var quest_thou_shall_not_pass = L.marker(map.unproject([2089, 1717], 
map.getMaxZoom()), {icon: quest_marker_lvl1})
    .bindPopup("Thou Shall Not Pass");

// Layer Groups
var lg_quests = L.layerGroup([quest_fake_pass, 
quest_thou_shall_not_pass]).addTo(map);

var lg_locat = L.layerGroup([locat_hanged_mans_tree]).addTo(map);

var baseLayers = {

};

var overlays = {
    "Quests" : lg_quests,
    "Locations" : lg_locat
};

// Add layer control
L.control.layers(baseLayers, overlays).addTo(map);
...