Creé un sitio web para cargar diferentes mapas (aplicaciones web en línea de ArcGIS) usando pestañas. Usé iframes para cambiar entre mapas. Funciona pero tengo un pequeño problema. Los mapas no se descargan correctamente, algunas capas no se ven. Debería actualizar cada vez antes de hacer clic en los botones que cargan los mapas. Cualquier idea de cargar los mapas sin hacer clic en el botón de actualización cada vez. Gracias por adelantado. Usé este código:
`
<button class="tablinks" onclick="loadMAP(event, 'MAP1')">Map1</button> <button class="tablinks" onclick="loadMAP(event, 'MAP2')">Map2</button> <button class="tablinks" onclick="loadMAP(event, 'MAP3')">Map3</button> </div> <!-- Tab content --> <div id="Map1" class="tabcontent"> <iframe id="map1frame" width="500" height="400" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="link to the map1"></iframe> </div> <div id="Map2" class="tabcontent"> <iframe id="map2frame" width="500" height="400" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="Link to the map2"></iframe> </div> <div id="Map3" class="tabcontent"> <iframe id="map3frame" width="500" height="400" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="Link to the map3"></iframe> </div> <script> function loadMAP(evt, MAPname) { // Declare all variables var i, tabcontent, tablinks; // Get all elements with class="tabcontent" and hide them tabcontent = document.getElementsByClassName("tabcontent"); for (i = 0; i < tabcontent.length; i++) { tabcontent[i].style.display = "none"; } // Get all elements with class="tablinks" and remove the class "active" tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } // Show the current tab, and add an "active" class to the button that opened the tab location.reload(); document.getElementById(MAPname).style.display = "block"; evt.currentTarget.className += " active"; } </script> `