1

I've recently upgraded from version 3.4 to version 3.5 of OpenLayers 3.

I use an ol.layer.Tile layer with a ol.source.TileArcGISRest source. My map projection is EPSG:27700 (British National Grid) which is not a standard projection so I have had to add it using the proj4js library.

This layer stopped working after upgrading to 3.5. It appears to be because the projection does not have an extent defined. After explicitly defining an extent the layer is rendered correctly.

My question is should you always define an extent when adding a projection to OpenLayers 3? If so why did it work before and what is the reason for this change in approach? As far as I can see this has potentially made the ol.layer.Tile less robust because users must remember to set an extent if they are using a non-standard projection.

I can see that there have been modifications around this area as shown in:

https://github.com/openlayers/ol3/commit/b05193fa454a963b33e6c5965181abde9b45b7fa

The code below recreates the error. If I uncomment the set projection extent line the error does not occur. In my real world code I'm pointing to a local ESRI MapServer that displays data in the British National Grid projection, I cannot use that in the example below as it is hosted internally.

<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="http://openlayers.org/en/v3.5.0/css/ol.css" type="text/css">
    <style>
      .map {
        height: 400px;
        width: 100%;
      }
    </style>
    <script src="http://openlayers.org/en/v3.5.0/build/ol.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4-src.js" type="text/javascript"></script>
    <title>OpenLayers 3 example</title>
  </head>
  <body>
    <h2>My Map</h2>
    <div id="map" class="map"></div>
    <script type="text/javascript">

        proj4.defs("EPSG:27700", "+proj=tmerc +lat_0=49 +lon_0=-2 +k=0.9996012717 +x_0=400000 +y_0=-100000 +ellps=airy +datum=OSGB36 +units=m +no_defs");

        //ol.proj.get("EPSG:27700").setExtent([0, 0, 700000, 1300000]);

        var initialLocation = {
            x: 333333,
            y: 333333,
            zoom: 0
        }

        //Create view
        var view = new ol.View({
            projection: "EPSG:27700",
            center: [initialLocation.x, initialLocation.y],
            resolutions: [1587.5031750063501, 264.5838625010584, 132.2919312505292, 74.08348150029634, 37.04174075014817, 17.197951062568794, 13.229193125052918, 6.614596562526459, 3.704174075014817, 2.6458386250105836, 1.0583354500042335, 0.6614596562526459],
            extent: [0, 0, 700000, 1300000],
            zoom: initialLocation.zoom
        });

        var layer = new ol.layer.Tile({
            source: new ol.source.TileArcGISRest({
                url: 'http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer'
            })
        })

        var map = new ol.Map({
            target: 'map',
            view: view
        });

        map.addLayer(layer);
    </script>
  </body>
</html>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.