Я использую ngx-leaflet с angular 8, чтобы показать карту во всплывающем окне, но когда я открываю всплывающее окно на карте, фрагменты карты не накладываются должным образом. Я также использовал map.invalidateSize (). Но все равно это не работает.
. html код для отображения всплывающего окна.
<div class="modal fade" id="collision1" role="dialog" aria-labelledby="toolenforces" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="row">
<div class="col-md-6" style="margin-top: 15px; margin-bottom: 15px;">
<div class="map1 records-map1" leaflet [leafletOptions]="options4"
(leafletMapReady)="openCollision($event)"></div>
</div>
</div>
.ts код
options4 = {
layers: [
tileLayer('https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
})
],
zoom: 7,
center: latLng([14.1111, 121.21111])};
openCollision(map : L.Map){
setTimeout(function() {
map.invalidateSize();
}, 10);}