Javascript HTML中嵌入的ArcOnline地图未集中显示
我正在尝试将我在ArcOnline上制作的地图嵌入HTML，并设法制作选项卡将它们全部嵌入到一个页面中。然而，我面临着一些我无法理解的问题。 我的问题如下： 每次我使用tabbing方法并将地图嵌入地图时，第一个选项卡集中在其他选项卡中，直到我单击home按钮，地图才会集中。我希望每次单击该选项卡时都将其集中化。如果我将地图从其他选项卡移动到第一个选项卡，它们工作正常，因此我假设地图一切正常。 此外，当地图位于另一个选项卡（然后是第一个活动选项卡）中时，属性表不会打开 我完整的html代码在最后供参考。 请告诉我是否有可能更改此地图的此行为。 我不知道出了什么问题Javascript HTML中嵌入的ArcOnline地图未集中显示,javascript,html,arcgis,esri,Javascript,Html,Arcgis,Esri,我正在尝试将我在ArcOnline上制作的地图嵌入HTML，并设法制作选项卡将它们全部嵌入到一个页面中。然而，我面临着一些我无法理解的问题。 我的问题如下： 每次我使用tabbing方法并将地图嵌入地图时，第一个选项卡集中在其他选项卡中，直到我单击home按钮，地图才会集中。我希望每次单击该选项卡时都将其集中化。如果我将地图从其他选项卡移动到第一个选项卡，它们工作正常，因此我假设地图一切正常。 此外，当地图位于另一个选项卡（然后是第一个活动选项卡）中时，属性表不会打开 我完整的html代码在最后
<!DOCTYPE html> <html> <head> <style> body {font-family: "Arial", sans-serif;}
/* Style the tab */ div.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1; }
/* Style the buttons inside the tab */ div.tab button {
background-color: inherit;
float: left;
border: black;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
font-size: 17px; }
/* Change background color of buttons on hover */ div.tab button:hover {
background-color: #fff; }
/* Create an active/current tablink class */ div.tab button.active {
background-color: lightblue; }
/* Style the tab content */ .tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
border-top: green; } </style> </head> <body>
<div class="tab"> <button class="tablinks" onclick="openMap(event, 'Mapwithlayers')" id="defaultOpen">Mapwithlayers</button> <button class="tablinks" onclick="openMap(event, 'Mapwithfilters')">Mapwithfilters</button> <button class="tablinks" onclick="openMap(event, 'GreyMapLayer')">GreyMapLayer</button> <div id="Mapwithlayers" class="tabcontent"> <span onclick="this.parentElement.style.display='none'" class="topright"></span>
<iframe width="100%" height="840px" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://arcg.is/2nLnY5A">
</iframe> </div>
<div id="Mapwithfilters" class="tabcontent"> <span onclick="this.parentElement.style.display='none'" class="topright"></span>
<iframe width="100%" height="840px" frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://arcg.is/2nLnY5A"></iframe>
</div>
<div id="GreyMapLayer" class="tabcontent"> <span onclick="this.parentElement.style.display='none'" class="topright"></span>
<iframe width="100%" height="840px" frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://un13.maps.arcgis.com/apps/Embed/index.html?webmap=1f25e4d600ad49539404f8c00c771a5a&extent=-177.7678,-52.1584,172.6076,78.4721&home=true&zoom=true&scale=true&legend=true&disable_scroll=true&theme=light"></iframe> </div>
</div> <script> function openMap(evt, mapname) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace("active", "");
}
document.getElementById(mapname).style.display = "block";
evt.currentTarget.className += "active"; }
// Get the element with id="defaultOpen" and click on it document.getElementById("defaultOpen").click(); </script>
</body> </html>
body{font-family:“Arial”，无衬线；}
/*设置选项卡的样式*/div.tab{
溢出：隐藏；
边框：1px实心#ccc；
背景色：#f1f1；}
/*设置tab*/div.tab按钮内按钮的样式{
背景色：继承；
浮动：左；
边框：黑色；
大纲：无；
光标：指针；
填充：14px 16px；
过渡：0.3s；
字体大小：17px；}
/*更改悬停按钮的背景色*/div.tab按钮：悬停{
背景色：#fff；}
/*创建活动/当前tablink类*/div.tab button.active{
背景色：浅蓝色；}
/*设置选项卡内容的样式*/.tabcontent{
显示：无；
填充：6px 12px；
边框：1px实心#ccc；
边框顶部：绿色；}
Mapwithlayers Mapwithfilters灰色播放器
函数openMap（evt，映射名）{
var i，tabcontent，tablinks；
tabcontent=document.getElementsByClassName（“tabcontent”）；
对于（i=0；i