3

I am following the OpenLayers FAQ regarding the use of coordinate systems that do not rely on the infamous Mercator projection. I thus produced a very small HTML with a simple example that could be later fed to an OpenLayers View object:

<!DOCTYPE html>
<html>
  <head>
    <title>CRS example</title>
    <link rel="stylesheet" href="https://openlayers.org/en/v5.3.0/css/ol.css" type="text/css">
    <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.5.0/proj4.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
    <script>

      var proj4               = proj4;             
      var register            = ol.proj.proj4.register; 
      var getProjection       = ol.proj.get;     

      proj4.defs('EPSG:152160', '+proj=igh +lat_0=0 +lon_0=0 +datum=WGS84 +units=m +no_defs');
      register(proj4);
      const homolosine = getProjection('EPSG:152160');

    </script>
  </body>
</html>

When this file is loaded in the browser the console shows an error message: "Uncaught EPSG:152160". A stack trace is shown:

enter image description here

This error message is shown both in Chromium and Firefox.

I tried changing the identifier string passed to the defs method, but the result is the same. Without the register method being applied the OpenLayers View object ignores the CRS passed in the projection parameter and uses Mercator instead.

How can I use the desired CRS with this software setup?

3

Neither +proj=igh or +proj=goode are currently supported by proj4.js but mproj does support +proj=goode Demo here https://jsfiddle.net/3bjo7rsL/ and the code below. Error catching is needed to handle "off the world" transforms at the edges.

<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" rel="stylesheet"/>
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mproj@0.0.21/dist/mproj.js"></script>
</head>
<body>
<div id="map" class="map"></div>
<script>

const epsg152160 =
  '+proj=goode +lat_0=0 +lon_0=0 +datum=WGS84 +units=m +no_defs';
const epsg3857 =
  '+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +wktext +no_defs';
const transform4326 = mproj(epsg152160);
const transform3857 = mproj(epsg3857, epsg152160);

const homolosine = new ol.proj.Projection({
  units: 'm',
  code: 'EPSG:152160'
});

ol.proj.addCoordinateTransforms(
  'EPSG:4326',
  homolosine,
  function(coordinate) {
    try {
      return transform4326.forward(coordinate)
    } catch (e) {
      return [undefined, undefined]
    }
  },
  function(coordinate) {
    try {
      return transform4326.inverse(coordinate)
    } catch (e) {
      return [undefined, undefined]
    }
  }
);

ol.proj.addCoordinateTransforms(
  'EPSG:3857',
  homolosine,
  function(coordinate) {
    try {
      return transform3857.forward(coordinate)
    } catch (e) {
      return [undefined, undefined]
    }
  },
  function(coordinate) {
    try {
      return transform3857.inverse(coordinate)
    } catch (e) {
      return [undefined, undefined]
    }
  }
);

var center = ol.proj.transform([0, 0], 'EPSG:4326', homolosine);

var baseMapLayer = new ol.layer.Tile({
  source: new ol.source.OSM()
});

var map = new ol.Map({
  target: 'map',
  layers: [ baseMapLayer ],
  view: new ol.View({
    projection: homolosine,
    center: center, 
    zoom: 3
  })
});

</script>
</body>
</html>
  • It would not cross my mind that a projection supported by PROJ and GDAL would not be supported by proj4js. Note also that +proj=goode is not the Homolosine projection, only +proj=igh is. – Luís de Sousa Aug 9 at 13:31

Your Answer

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

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