开发者

Initializing an openlayers map from an external Javascript file

My aim is to load an OpenLayers map using an external JS file. In the head I have a jQuery library, and in the body I have the OpenLayers library, my Openlayers code and the div tag.

<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>

However I don't have access to the body tag so I can't fire onload="init()" which is how most of the examples work.

Instead, at the bottom of MyMapScript.js I've added the line below.

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

This is where it gets a little odd. Using Firebug I can see that this code is called and that it initializes the map object with all it's properties. I can also see that it is calling the WMS server and getting all the map tiles successfu开发者_JAVA百科lly. However it doesn't actually draw anything on the page and no extra divs are added to the HTML.

This page talks about a similar issue but I'm not sure how to apply it to my situation as for me init() is actually being called. http://bytes.com/topic/javascript/answers/855670-unusual-behavior-function-calls-java-script

The solution I've gone for in the end is to do this.

<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>

Which works but feels like a fudge.

Is there a way to initialize an OpenLayers map from an external javascript file? Is there anything wrong with my window.onload=init; solution? If I have to do it inline with the HTML is there are better way of doing it?


I fixed the issue myself. My initial code worked just fine apart from two things. I was missing the width and height on the div tag, and I had ordered the statements so that the div came after the javascript files, rather than before.

It should have looked like this.

<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>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜