Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

Here is my code:

var map;

function init() {
 var options = {
  maxExtent: new  OpenLayers.Bounds(-135.326858520508,-30.5615100860596,179.357788085938,69.604377746582),
  units: 'm',
  projection: "EPSG:900913",
};
     map = new OpenLayers.Map('map_element', options);            
            // setup tiled layer
            var tiled = new OpenLayers.Layer.WMS(
                "ne_10m_railroads", "http://localhost:8080/geoserver/earth/wms",
                {
                    LAYERS: 'earth:ne_10m_railroads',
                    STYLES: '',
                    format: OpenLayers.Format.WMSGetFeatureInfo,
                    tiled: true,
                    tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
                },
                {
                    buffer: 0,
                    displayOutsideMaxExtent: true,
                    isBaseLayer: true,

                } 
            );

            map.addLayer(tiled);

   if(!map.getCenter()){ map.zoomToMaxExtent(); }
}

Snapshot of the webpage I created - images are not loading!

This is the code for layer preview generated by GeoServer :

 var map;
        var untiled;
        var tiled;
        var pureCoverage = false;
        // pink tile avoidance
        OpenLayers.IMAGE_RELOAD_ATTEMPTS = 5;
        // make OL compute scale according to WMS spec
        OpenLayers.DOTS_PER_INCH = 25.4 / 0.28;

        function init(){
            // if this is just a coverage or a group of them, disable a few items,
            // and default to jpeg format
            format = 'image/png';
            if(pureCoverage) {
                document.getElementById('filterType').disabled = true;
                document.getElementById('filter').disabled = true;
                document.getElementById('antialiasSelector').disabled = true;
                document.getElementById('updateFilterButton').disabled = true;
                document.getElementById('resetFilterButton').disabled = true;
                document.getElementById('jpeg').selected = true;
                format = "image/jpeg";
            }

            var bounds = new OpenLayers.Bounds(
                -135.326858520508, -30.5615100860596,
                179.357788085938, 69.604377746582
            );
            var options = {
                controls: [],
                maxExtent: bounds,
                maxResolution: 1.2292369008064297,
                projection: "EPSG:900913",
                units: 'm'
            };
            map = new OpenLayers.Map('map', options);

            // setup tiled layer
            tiled = new OpenLayers.Layer.WMS(
                "earth:ne_10m_railroads - Tiled", "http://localhost:8080/geoserver/earth/wms",
                {
                    LAYERS: 'earth:ne_10m_railroads',
                    STYLES: '',
                    format: format,
                    tiled: true,
                    tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
                },
                {
                    buffer: 0,
                    displayOutsideMaxExtent: true,
                    isBaseLayer: true,
                    yx : {'EPSG:900913' : false}
                } 
            );

            // setup single tiled layer
            untiled = new OpenLayers.Layer.WMS(
                "earth:ne_10m_railroads - Untiled", "http://localhost:8080/geoserver/earth/wms",
                {
                    LAYERS: 'earth:ne_10m_railroads',
                    STYLES: '',
                    format: format
                },
                {
                   singleTile: true, 
                   ratio: 1, 
                   isBaseLayer: true,
                   yx : {'EPSG:900913' : false}
                } 
            );

            map.addLayers([untiled, tiled]);

            // build up all controls
            map.addControl(new OpenLayers.Control.PanZoomBar({
                position: new OpenLayers.Pixel(2, 15)
            }));
            map.addControl(new OpenLayers.Control.Navigation());
            map.addControl(new OpenLayers.Control.Scale($('scale')));
            map.addControl(new OpenLayers.Control.MousePosition({element: $('location')}));
            map.zoomToExtent(bounds);

            // wire up the option button
            var options = document.getElementById("options");
            options.onclick = toggleControlPanel;

            // support GetFeatureInfo
            map.events.register('click', map, function (e) {
                document.getElementById('nodelist').innerHTML = "Loading... please wait...";
                var params = {
                    REQUEST: "GetFeatureInfo",
                    EXCEPTIONS: "application/vnd.ogc.se_xml",
                    BBOX: map.getExtent().toBBOX(),
                    SERVICE: "WMS",
                    INFO_FORMAT: 'text/html',
                    QUERY_LAYERS: map.layers[0].params.LAYERS,
                    FEATURE_COUNT: 50,
                    Layers: 'earth:ne_10m_railroads',
                    WIDTH: map.size.w,
                    HEIGHT: map.size.h,
                    format: format,
                    styles: map.layers[0].params.STYLES,
                    srs: map.layers[0].params.SRS};

                // handle the wms 1.3 vs wms 1.1 madness
                if(map.layers[0].params.VERSION == "1.3.0") {
                    params.version = "1.3.0";
                    params.j = parseInt(e.xy.x);
                    params.i = parseInt(e.xy.y);
                } else {
                    params.version = "1.1.1";
                    params.x = parseInt(e.xy.x);
                    params.y = parseInt(e.xy.y);
                }

                // merge filters
                if(map.layers[0].params.CQL_FILTER != null) {
                    params.cql_filter = map.layers[0].params.CQL_FILTER;
                } 
                if(map.layers[0].params.FILTER != null) {
                    params.filter = map.layers[0].params.FILTER;
                }
                if(map.layers[0].params.FEATUREID) {
                    params.featureid = map.layers[0].params.FEATUREID;
                }
                OpenLayers.loadURL("http://localhost:8080/geoserver/earth/wms", params, this, setHTML, setHTML);
                OpenLayers.Event.stop(e);
            });
        }

and its preivew is below:enter image description here


Oh I got it!!! I shouldn't add those extra parameters: But I want to know what it actually means : I changed the Layer code to this and its working:

 map = new OpenLayers.Map('map_element', options);            
            // setup tiled layer
            var tiled = new OpenLayers.Layer.WMS(
                "ne_10m_railroads", "http://localhost:8080/geoserver/earth/wms",
                {
                    LAYERS: 'earth:ne_10m_railroads'},

                {} 
            );

What happens when I add these extra parameters..where it is wrong?

{
                LAYERS: 'earth:ne_10m_railroads',
                STYLES: '',
                format: OpenLayers.Format.WMSGetFeatureInfo,
                tiled: true,
                tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
            },
share|improve this question
add comment

2 Answers 2

up vote 2 down vote accepted

The WMS object takes 4 parameters - name, baseURL, WMS options. OpenLayers options. As you have in your working code:

 map = new OpenLayers.Map('map_element', options);            
            // setup tiled layer
            var tiled = new OpenLayers.Layer.WMS(
                "ne_10m_railroads", "http://localhost:8080/geoserver/earth/wms",
                {
                    LAYERS: 'earth:ne_10m_railroads'},

                {} 
            );

When you tried to add extra parameters they were OpenLayers parameters and so should have gone in the second map not the first. So

       {
            LAYERS: 'earth:ne_10m_railroads',
            STYLES: '',
            format: OpenLayers.Format.WMSGetFeatureInfo,
            tiled: true,
            tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
        },

Should be:

       {
            LAYERS: 'earth:ne_10m_railroads',
            STYLES: '',
            format: 'image/png'

        },
        {
            tiled: true,
            tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
        } 

so that the tiled parts go to OpenLayers rather than the WMS (which doesn't understand them).

share|improve this answer
add comment

You have added

format: OpenLayers.Format.WMSGetFeatureInfo,

The format parameter controls which MIME Type map images should be (as JPEG, PNG.... or even RSS, GML, KML if it is an WFS).

OpenLayers.Format.WMSGetFeatureInfo is another type of request, not a format as it is meant to be for this parameter, so this association is not allowed.

You have to write

format: 'image/png',

like it is in the layer preview

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.