CODEWITHSUNDEEP
javascriptgoogle-chromeopenlayers-3mapserver
Siebe Bosch
Siebe Bosch

Reputation: 223

OpenLayers-3 raster layer not shown when Chrome is maximized window mode

I have this weird problem with OpenLayers 3 rendering a Mapserver WMS layer.

When Chrome is in maximized mode, the grid does not show. However, when I switch to the 'window' view or whatever that's called, it works flawlessly.

grid shows
grid does not show

EDIT I just found out that mapserver writes the following error to the logfile: [Mon Apr 11 15:08:46 2016].291000 msWMSLoadGetMapParams(): WMS server error. Image size out of range, WIDTH and HEIGHT must be between 1 and 2048 pixels. Apparently increasing the window size also causes the WMS to produce a larger png? How should I go about solving this?/EDIT

Here's the Javascript code:

    var waterFeature, farmerFeature;
    var waterStyle, farmerStyle;
    var waterSource, farmerSource;
    var layerOSM, layerBiomass, layerNDVI, layerFarmer, layerWater;
    var map;

    function initOpenLayers(){

        waterFeature = new ol.Feature({
            geometry: new ol.geom.Point([1, 15]),
            name: 'Null Island',
            population: 4000,
            rainfall: 500
        });

        farmerFeature = new ol.Feature({
            geometry: new ol.geom.Point([1, 16]),
            //name: 'Null Island',
            //population: 4000,
            //rainfall: 500
        });

        waterStyle = new ol.style.Style({
            image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
                anchor: [0.5, 46],
                anchorXUnits: 'fraction',
                anchorYUnits: 'pixels',
                src: 'images/waterIcon.png',
                scale: 0.03
            }))
        });

        farmerStyle = new ol.style.Style({
            image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
                anchor: [0.5, 46],
                anchorXUnits: 'fraction',
                anchorYUnits: 'pixels',
                src: 'images/farmerIcon.png',
                scale: 0.03
            }))
        });

        waterFeature.setStyle(waterStyle);
        farmerFeature.setStyle(farmerStyle);

        waterSource = new ol.source.Vector({
            features: [waterFeature]
        });

        farmerSource = new ol.source.Vector({
            features: [farmerFeature]
        });

        layerOSM = new ol.layer.Tile({
            source: new ol.source.OSM({
                attributions: [
                    'All maps © <a href="http://www.opencyclemap.org/">OpenCycleMap</a>',
                    ol.source.OSM.ATTRIBUTION
                ],
                url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
            })
        });

        //layerOSM.setVisible(false);

        layerBiomass = new ol.layer.Image({
            //extent: [-13884991, 2870341, -7455066, 6338219],
            //extent: [-18, -36, 52, 58],
            source: new ol.source.ImageWMS({
                projection: 'EPSG:3857',
                //url: '/cgi-bin/mapserv.exe?map=c:/Websites/SWIMM/apps/STAMP/maps/STAMP/MALI.map&service=wms&version=1.1.1&request=GetMap&layers=biomass&styles=&width=400&height=400&format=image%2Fpng&srs=EPSG:3857&bbox=-18,-36,52,58',
                url: '/cgi-bin/mapserv.exe?map=c:/Websites/SWIMM/apps/STAMP/maps/STAMP/MALI.map&service=wms&version=1.1.1&request=GetMap&layers=biomass&styles=&width=400&height=400&format=image%2Fpng&srs=EPSG:3857',
                params: {'LAYERS': 'Biomass'},
                serverType: 'mapserver'
            })
        });

        layerNDVI = new ol.layer.Image({
            //extent: [-13884991, 2870341, -7455066, 6338219],
            //extent: [-18, -36, 52, 58],
            source: new ol.source.ImageWMS({
                projection: 'EPSG:3857',
                //url: '/cgi-bin/mapserv.exe?map=c:/Websites/SWIMM/apps/STAMP/maps/STAMP/MALI.map&service=wms&version=1.1.1&request=GetMap&layers=biomass&styles=&width=400&height=400&format=image%2Fpng&srs=EPSG:3857&bbox=-18,-36,52,58',
                url: '/cgi-bin/mapserv.exe?map=c:/Websites/SWIMM/apps/STAMP/maps/STAMP/MALI.map&service=wms&version=1.1.1&request=GetMap&layers=biomass&styles=&width=400&height=400&format=image%2Fpng&srs=EPSG:3857',
                params: {'LAYERS': 'NDVI'},
                serverType: 'mapserver'
            })
        });


        layerFarmer = new ol.layer.Vector({
            source: farmerSource
        });

        layerWater = new ol.layer.Vector({
            source: waterSource
        });

        //initialize the raster visibilities. Start by default with the biomass raster
        layerNDVI.setVisible(false);
        layerBiomass.setVisible(true);


        map = new ol.Map({
            layers: [layerOSM, layerBiomass, layerNDVI, layerWater, layerFarmer],
            target: 'map',
            view: new ol.View({
                //projection: 'EPSG:3857',
                //center: [100000, 1000000],
                projection: 'EPSG:4326',
                center: [1,16],
                zoom: 6
            }),
            controls: ol.control.defaults().extend([
                new ol.control.ScaleLine()
            ])
        });

        //map.getView().setCenter([4,16]);

    };

    function toggleLayer() {
        layerBiomass.setVisible(!layerBiomass.getVisible());
        layerNDVI.setVisible(!layerBiomass.getVisible());
    }

And here's the map file content:

MAP
  CONFIG "MS_ERRORFILE" "c:/temp/ms_error.txt"
  IMAGETYPE      PNG
  OUTPUTFORMAT
    NAME "png"
    DRIVER AGG/PNG8
    MIMETYPE "image/png"
    EXTENSION "png"
    TRANSPARENT ON
  IMAGEMODE RGBA
  FORMATOPTION "QUANTIZE_FORCE=on"
  FORMATOPTION "QUANTIZE_COLORS=256"
  FORMATOPTION "INTERLACE=OFF"
END

EXTENT        -18 -36 52 38
  PROJECTION
  'init=epsg:3857'
END

WEB
  IMAGEPATH "/Websites/SWIMM/tmp/"
  IMAGEURL  "/tmp/"
  METADATA
    'wms_enable_request' '*'
    'wms_title' 'MS'
  END
END

LAYER # MODIS raster layer begins here
  NAME         "NDVI"
  DATA         "./NDVI_2016022.img"
  STATUS       ON
  TYPE         RASTER
  #PROCESSING   "BANDS=1,2,3"
  OFFSITE      255 0 0

METADATA
  "wms_title" "NDVI"
  "wms_srs" "EPSG:4326"
  "wms_name" "NDVI"
  "wms_server_version" "1.1.1"
  "wms_format" "image/png"
  "wms_onlineresource" "http://localhost/cgi-bin/mapserv.exe?map=c:/Websites/SWIMM/apps/STAMP/maps/STAMP/MALI.map&"
END

PROJECTION
     "init=epsg:4326"
END
  CLASS EXPRESSION ([pixel] >= 0 and [pixel] <= 10)  STYLE COLOR 255 255 255 END NAME "Clouds" END
  CLASS EXPRESSION ([pixel] >= 11  and [pixel] <= 17) STYLE COLOR 100 128 255 END NAME "Water"  END
  CLASS EXPRESSION ([pixel] >= 19  and [pixel] <= 19) STYLE COLOR 100 128 255 END NAME "Water"  END
  CLASS EXPRESSION ([pixel] >= 20 and [pixel] <= 89) STYLE COLOR 176 96 48 END NAME "< 0.00" END
  CLASS EXPRESSION ([pixel] >= 90 and [pixel] <= 96) STYLE COLOR 255 255 0 END NAME "0.00-0.05" END
  CLASS EXPRESSION ([pixel] >= 97 and [pixel] <= 102) STYLE COLOR 255 255 128 END NAME "0.05-0.10" END
  CLASS EXPRESSION ([pixel] >= 103 and [pixel] <= 108) STYLE COLOR 255 255 128 END NAME "0.10-0.15" END
  CLASS EXPRESSION ([pixel] >= 109 and [pixel] <= 129) STYLE COLOR 191 223 96 END NAME "0.15-0.20" END
  CLASS EXPRESSION ([pixel] >= 130 and [pixel] <= 155) STYLE COLOR 128 192 64 END NAME "0.20-0.25" END
  CLASS EXPRESSION ([pixel] >= 156 and [pixel] <= 181) STYLE COLOR 64 160 32 END NAME "0.25-0.30" END
  CLASS EXPRESSION ([pixel] >= 182 and [pixel] <= 246) STYLE COLOR 0 128 0 END NAME "0.30-0.35" END
  CLASS EXPRESSION ([pixel] >= 247 and [pixel] <= 253) STYLE COLOR 0 64 0 END NAME "0.35-0.40" END
  CLASS EXPRESSION ([pixel] >= 254 and [pixel] <= 255) STYLE COLOR 255 255 255 END NAME "Missing" END
END # MODIS raster layer ends here

LAYER # MODIS raster layer begins here
  NAME         "BIOMASS"
  DATA         "./Biomass_2015.tif"
  STATUS       ON
  TYPE         RASTER
  #PROCESSING   "BANDS=1,2,3"
  TRANSPARENCY 60
  OFFSITE      255 0 0

  METADATA
    "wms_title" "BIOMASS"
    "wms_srs" "EPSG:4326"
    "wms_name" "BIOMASS"
    "wms_server_version" "1.1.1"
    "wms_format" "image/png"
    "wms_onlineresource" "http://localhost/cgi-bin/mapserv.exe?map=c:/Websites/SWIMM/apps/STAMP/maps/STAMP/MALI.map&"
END

PROJECTION
     #"proj=latlong"
     #"ELLPS=WGS84"
     #"datum=WGS84"
     "init=epsg:4326"
END
  CLASS EXPRESSION ([pixel] <= 0) STYLE COLOR 212 159 93 END NAME "0"       END
  CLASS EXPRESSION ([pixel] > 0  and [pixel] < 500) STYLE COLOR 233 205 137 END NAME "500"  END
  CLASS EXPRESSION ([pixel] >= 500  and [pixel] < 1000) STYLE COLOR 255 251 182 END NAME "1000"  END
  CLASS EXPRESSION ([pixel] >= 1000  and [pixel] < 5000) STYLE COLOR 199 237 124 END NAME "5000"  END
  CLASS EXPRESSION ([pixel] >= 5000) STYLE COLOR 143 223 67 END NAME "15000"  END
END # MODIS raster layer ends here

END

Upvotes: 1

Views: 706

Answers (1)

Siebe Bosch
Siebe Bosch

Reputation: 223

Solved it.

Thanks to bartvde. Ironically however I had to add MAXSIZE to the MAP file. Apparently my window size slightly exceeded 1024 px, which is the maximum that is supported by mapserver by default. By setting MAXSIZE 2600 I was able to solve the problem. Now the map is also shown at maximum window size.

Upvotes: 3

Related Questions