
<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

    <style type="text/css">

        #map {

            width: 800px;

            height: 475px;

            border: 1px solid black;

        }

    </style>

    <script src="../lib/OpenLayers.js"></script>

    <script src="../lib/excanvas.js"></script>

    <script type="text/javascript">

        <!--

        var lon = 5;

        var lat = 40;

        var zoom = 5;

        var map, layer, click;


        function init(){

            map = new OpenLayers.Map( $('map') );

            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 

                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );

            map.addLayer(layer);

            
            layer = new OpenLayers.Layer.Vector( "Vector Test Layer" );

            map.addLayer(layer);

            
            var p2 = new OpenLayers.Vector.WKT('POINT(5.23 43.51)');

            layer.addFeature(p2);

            
            var multiline = new OpenLayers.Vector.WKT('LINESTRING(0 43, 2 43, 3 44, 4 44, 5 43)');

            layer.addFeature(multiline);

            
            var polygon = new OpenLayers.Vector.WKT('POLYGON(-1 38, -2 40, -1 41, 0 41, 0 38, -1 38)');

            layer.addFeature(polygon);

            
            map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);

            map.addControl( new OpenLayers.Control.LayerSwitcher() );

            map.addControl( new OpenLayers.Control.MousePosition() );

        }

        
        // -->

    </script>

  </head>

  <body onload="init()">

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

  </body>

</html>