div中調用javascript函數

我遵循Google Map API教程here，特別是JAVASCRIPT + HTML版本。我相信相關的部分將是div中調用javascript函數

<body> 
    <div id="map"></div> 
    <script> 

var map; 
function initMap() { 
    map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: -34.397, lng: 150.644}, 
    zoom: 8 
    }); 
}

我想用兩個流體容器，其中之一將包含地圖的頁面引導。我正在關注Bootstrap的fluid layout example。所以我有類似的東西

<div class="container-fluid"> 
    <div class="row-fluid"> 
<div class="span2"> 
    {% for q in qs %} 
    <p>{{ q.name }} {{ q.address}}</p> 
    {% endfor %} 
</div> 
<div class="span10" id="map"></div> 
</div> 
</div>

它不顯示地圖。我想知道是否

<div class="span10" id="map"></div>

是在這裏做的正確的事情，以及是否應該改變其他任何東西。

編輯：

<div id="map"></div> <- This works 
<div class="container-fluid"> 
    <div class="row-fluid"> 
    <div class="span2"></div> 
    <div class="span10" id="map"></div> <- This doesn't work 
    </div> 
</div>

來源

2015-12-23 user2857014

而實際上，你在任何地方調用'initMap'功能？ – adeneo

@adeneo我意識到我其實不是......但是當我按照教程

這只是顯示地圖。這是如何工作的？ – user2857014

您是否檢查過引導元素上的CSS？這可能是因爲您意外地獲得了0高度並需要設置特定的尺寸。查看瀏覽器工具中的元素應該會顯示地圖是否實際存在並且不可見。 –

變化

function initMap() { 
    map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: -34.397, lng: 150.644}, 
    zoom: 8 
    }); 
}

與

(function() { 
    map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: -34.397, lng: 150.644}, 
    zoom: 8 
    }); 
}())

來源

2015-12-23 08:19:23

div中調用javascript函數

回答

相關問題