Question

我有一张带有标记和簇的地图。我使用https://stackoverflow.com/a/16845714/2660362的解决方案来调整地图的大小以显示标记/群集。然后我将教程示例与全屏功能结合起来。现在，当我全屏播放时，如果地图可以放大，那将是非常好的。有一个被调用的函数，但它不会重新缩放地图。这可能吗？

var map = L.map( 'map', {
    center: [20.0, 5.0],
    //minZoom: 1,
    //zoom: 1,
    fullscreenControl: true,
    fullscreenControlOptions: {
        position: 'topleft'
        }
})

L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
  subdomains: ['a', 'b', 'c']
}).addTo( map )

var myURL = jQuery( 'script[src$="talks.js"]' ).attr( 'src' ).replace( 'talks.js', '' )

var myIcon = L.icon({
  iconUrl: myURL + 'images/pin24.png',
  iconRetinaUrl: myURL + 'images/pin48.png',
  iconSize: [29, 24],
  iconAnchor: [9, 21],
  popupAnchor: [0, -14]
})

var markerClusters = L.markerClusterGroup({maxClusterRadius:30});


for ( var i=0; i < markers.length; ++i )
{
 var m = L.marker( [markers[i].lat, markers[i].lng], {icon: myIcon} )
                 .bindPopup( markers[i].name  );

  markerClusters.addLayer( m );
}

map.addLayer( markerClusters );

//map.fitBounds(markers.getBounds());

var bounds = L.latLngBounds(markers);
map.fitBounds(bounds);




// events are fired when entering or exiting fullscreen.
map.on('enterFullscreen', function(){
  console.log('entered fullscreen');
  bounds = L.latLngBounds(markers);
  map.fitBounds(bounds);
});

map.on('exitFullscreen', function(){
  console.log('exited fullscreen');
});

Answer 1

编辑：代码中的markers变量是一个数组，而不是一个传单层组，因此传单不能返回边界。

我已经更改了代码以遵循群集范围并且它有效：

map.on('enterFullscreen', function(){
     console.log('entered fullscreen');
     bounds = markerClusters.getBounds();
     map.fitBounds(bounds);
});

进入全屏模式时放大传单地图

1 个答案: