從外部JavaScript文件初始化openlayers地圖

Question

我的目標是使用外部JS文件加載OpenLayers地圖。在頭上，我有一個jQuery庫，並在體內我有OpenLayers庫，我的Openlayers代碼和div標籤。

<script type="text/javascript" src="http://example.com/OpenLayers.js"></script> 
<script type="text/javascript" src="http://example.com/MyMapScript.js"></script> 
<div id="map"></div> 

但是我沒有訪問body標籤，所以我不能火onload="init()"這是何等的大多數示例工作。

取而代之，在MyMapScript.js的底部我添加了下面的一行。

jQuery(window).load(init()); 

這就是它有點奇怪。使用Firebug我可以看到這個代碼被調用，它用它的所有屬性初始化地圖對象。我也可以看到它正在調用WMS服務器併成功獲取所有地圖切片。但是它實際上並沒有在頁面上繪製任何東西，也沒有額外的div添加到HTML中。

本頁面提到了類似的問題，但我不知道如何將其應用於我的情況，因爲init()實際上正在調用。 http://bytes.com/topic/javascript/answers/855670-unusual-behavior-function-calls-java-script

我最終去的解決方案是做到這一點。

<script type="text/javascript" src="http://example.com/OpenLayers.js"></script> 
<script type="text/javascript" src="http://example.com/MyMapScript.js"></script> 
<script type="text/javascript"> window.onload=init; </script> 
<div id="map"></div> 

這有效，但感覺像一個軟糖。

有沒有辦法從外部JavaScript文件初始化OpenLayers地圖？ 我的window.onload=init;解決方案有什麼問題嗎？ 如果我必須使用HTML進行內聯，是否有更好的方法呢？

Answer 1

我自己解決了這個問題。除了兩件事情之外，我的初始代碼工作得很好。我錯過了div標籤的寬度和高度，並且我已經訂購了這些語句，以便div在javascript文件之後，而不是之前。

它應該看起來像這樣。

<div id="map" style="width:400px; height:400px;"></div>  
<script type="text/javascript" src="http://example.com/OpenLayers.js"></script> 
<script type="text/javascript" src="http://example.com/MyMapScript.js"></script>