OpenLayers OpenLayers makes it easy to put a dynamic map in any web page. It can display map tiles and markers loaded from any source. MetaCarta developed the initial version of OpenLayers and gave it to the public to further the use of geographic information of all kinds. OpenLayers is completely free, Open Source JavaScript, released under a BSD-style License.
Since HSLayers is trying to be build on-top-of OpenLayers, you have to understand it’s concept, in order to be able to work with HSLayers.
Let’s have simple HTML example (the source is 01_map.html):
1 2 3 4 5 6 7 8 9 10 | <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>OpenLayers Example</title>
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<body onload="init()">
<h1>First OpenLayer example</h1>
<div id="map" style="width:500px;height:500px"></div>
</body>
</html>
|
You see, there is function init(), which is to be called, on load of the page. Let’s define the function:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <script type="text/javascript">
var map;
function init(){
map = new OpenLayers.Map('map');
var wmsLayer = new OpenLayers.Layer.WMS(
"OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0",
{layers: 'basic'},
{'displayInLayerSwitcher':false}
);
map.addLayers([wmsLayer]);
if (!map.getCenter()) {
map.zoomToMaxExtent();
}
}
</script>
|
And you should see the map.