HSLayers.MapViewer

HSLayers.MapViewer is comprehensive shortcut for MapPanel, InfoPanel, OpenLayers.Map and other objects and controls, among others it is the HSLayers.Control.LayerSwitcher.

        <script type="text/javascript" src="/wwwlibs/ext/3.1.1/ext-all.js"></script>
        <script type="text/javascript" src="../build/OpenLayers.js"></script>
        <script type="text/javascript" src="../source/HSLayers.js"></script>
        <script type="text/javascript" src="../source/HSLayers/MapViewer.js"></script>
        <script type="text/javascript" src="../source/HSLayers/InfoPanel.js"></script>
        <script type="text/javascript" src="../source/HSLayers/OWS.js"></script>
        <script type="text/javascript" src="../source/HSLayers/OWS/WMS.js"></script>
        <script type="text/javascript" src="../source/HSLayers/OWS/WFS.js"></script>
        <script type="text/javascript" src="../source/HSLayers/Printer.js"></script>
        <script type="text/javascript" src="../source/HSLayers/MapPanel.js"></script>
        <script type="text/javascript" src="../source/HSLayers/MapPanel/HistoryButtons.js"></script>
        <script type="text/javascript" src="../source/HSLayers/MapPanel/WMCButtons.js"></script>
        <script type="text/javascript" src="../source/HSLayers/MapPanel/WMCForm.js"></script>
        <script type="text/javascript" src="../source/HSLayers/Control/LayerSwitcher.js"></script>

You see, that number of JavaScripts got a bit longer. Don’t worry, we will make it shorter in next step. Anyway, this is much better for debugging. Consider using:

<script type="text/javascript" src="build/MapViewer.js"></script>

This is in one compressed file everything you need for the MapViewer. But to debug this is a hell, so as compromise, you can use:

<script type="text/javascript" src="build/MapViewer-debug.js"></script>

Which is the same, but in uncompressed form and so it is easier to debug in case error comes out (which surely will).

Creating a map with LayerSwitcher and InfoPanel, Printing, OWS clients is simple:

            OpenLayers.ProxyHost = "/cgi-bin/olproxy.cgi?url=";
            mapViewer = new HSLayers.MapViewer({
                width: 600,
                height:550,
                renderTo: Ext.getBody()
            });

            map = new OpenLayers.Map(mapViewer.mapPanel.body.dom.id);
            map.addLayer(new OpenLayers.Layer.WMS("MetaCarta WMS",
                       "http://labs.metacarta.com/wms/vmap0",
                       {layers: 'basic'}
                   ));
            map.zoomToMaxExtent();

            mapViewer.setMap(map);

The example is taken from http://dev.bnhelp.cz/wwwlibs/hslayers/branches/editace/examples/MapViewer.html