5
Tôi đang sử dụng các tab để hiển thị nội dung rõ ràng, nhưng một trong số chúng ngừng tải xuống tốt vì nó nằm trong tab chuyển đổi dữ liệu. Nó là một bản đồ Leaflet. Đây là mã: MãTab Chuyển đổi dữ liệu không tải xuống bản đồ Leaflet
Navbar:
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#home">Données principales</a></li>
<li><a data-toggle="tab" href="#carte">Carte</a></li>
</ul>
<div class="tab-content">
<div id="home" class="tab-pane fade in active">Lorem ipsum</div>
<div id="carte" class="tab-pane fade"> **//see script below\\** </div>
</div>
Script:
<div id="carteBenef"></div>
<script type="text/javascript">
$(document).ready(function() {
var map = new L.Map('carteBenef');
var cloudmadeUrl = 'http://{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png',
subDomains = ['otile1', 'otile2', 'otile3', 'otile4'],
cloudmadeAttrib = 'Data, imagery and map information provided by <a href="http://open.mapquest.co.uk" target="_blank">MapQuest</a>, <a href="http://www.openstreetmap.org/" target="_blank">OpenStreetMap</a> and contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/" target="_blank">CC-BY-SA</a>';
var cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttrib, subdomains: subDomains});
var iades = new L.LatLng(<?php echo $beneficiaire->latitude . ', ' . $beneficiaire->longitude; ?>)
map.addLayer(cloudmade).setView(iades, 15);
var benefLocation = new L.LatLng(<?php echo $beneficiaire->latitude . ', ' . $beneficiaire->longitude; ?>);
var benef = new L.Marker(benefLocation);
map.addLayer(benef);
benef.bindPopup("<?php echo htmlspecialchars($beneficiaire->nom) . ' ' . htmlspecialchars($beneficiaire->prenom); ?>").openPopup();
});
</script>
bản đồ được xuất hiện khá lâu trước khi tôi đặt nó trong tab, không một người nào đó có một ý tưởng tại sao nó không hoạt động ngay bây giờ? Cảm ơn bạn =)
Đó chính là vấn đề tôi gặp phải, cảm ơn bạn! – Ned
@Ned, vui lòng đính kèm mã sửa chữa, với 'map.invalidateSize()' cho câu hỏi của bạn – HAYMbl4