diff --git a/examples/animation.js b/examples/animation.js index a5a85eecbd..f79b93c60e 100644 --- a/examples/animation.js +++ b/examples/animation.js @@ -34,12 +34,12 @@ function elastic(t) { return Math.pow(2, -10 * t) * Math.sin((t - 0.075) * (2 * Math.PI) / 0.3) + 1; } -var london = ol.proj.transform([-0.12755, 51.507222], 'EPSG:4326', 'EPSG:3857'); -var moscow = ol.proj.transform([37.6178, 55.7517], 'EPSG:4326', 'EPSG:3857'); -var istanbul = ol.proj.transform([28.9744, 41.0128], 'EPSG:4326', 'EPSG:3857'); -var rome = ol.proj.transform([12.5, 41.9], 'EPSG:4326', 'EPSG:3857'); -var bern = ol.proj.transform([7.4458, 46.95], 'EPSG:4326', 'EPSG:3857'); -var madrid = ol.proj.transform([-3.683333, 40.4], 'EPSG:4326', 'EPSG:3857'); +var london = ol.proj.fromLonLat([-0.12755, 51.507222]); +var moscow = ol.proj.fromLonLat([37.6178, 55.7517]); +var istanbul = ol.proj.fromLonLat([28.9744, 41.0128]); +var rome = ol.proj.fromLonLat([12.5, 41.9]); +var bern = ol.proj.fromLonLat([7.4458, 46.95]); +var madrid = ol.proj.fromLonLat([-3.683333, 40.4]); var view = new ol.View({ // the view's initial state diff --git a/examples/d3.js b/examples/d3.js index 861c09208d..b6cbe6cf1a 100644 --- a/examples/d3.js +++ b/examples/d3.js @@ -21,7 +21,7 @@ var map = new ol.Map({ ], target: 'map', view: new ol.View({ - center: ol.proj.transform([-97, 38], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-97, 38]), zoom: 4 }) }); diff --git a/examples/geolocation-orientation.js b/examples/geolocation-orientation.js index a468dc98d7..59ac348b20 100644 --- a/examples/geolocation-orientation.js +++ b/examples/geolocation-orientation.js @@ -10,7 +10,7 @@ goog.require('ol.source.OSM'); // creating the view var view = new ol.View({ - center: ol.proj.transform([5.8713, 45.6452], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([5.8713, 45.6452]), zoom: 19 }); diff --git a/examples/graticule.js b/examples/graticule.js index c2b05248f9..dce26d9f2f 100644 --- a/examples/graticule.js +++ b/examples/graticule.js @@ -16,7 +16,7 @@ var map = new ol.Map({ renderer: 'canvas', target: 'map', view: new ol.View({ - center: ol.proj.transform([4.8, 47.75], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([4.8, 47.75]), zoom: 5 }) }); diff --git a/examples/hue-saturation.js b/examples/hue-saturation.js index 6d163f9790..afbbf3a79a 100644 --- a/examples/hue-saturation.js +++ b/examples/hue-saturation.js @@ -34,7 +34,7 @@ if (!ol.has.WEBGL) { renderer: 'webgl', target: 'map', view: new ol.View({ - center: ol.proj.transform([-9.375, 51.483333], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-9.375, 51.483333]), zoom: 15 }) }); diff --git a/examples/image-filter.js b/examples/image-filter.js index a94de1f14c..c8e7fd4eea 100644 --- a/examples/image-filter.js +++ b/examples/image-filter.js @@ -14,7 +14,7 @@ var map = new ol.Map({ layers: [imagery], target: 'map', view: new ol.View({ - center: ol.proj.transform([-120, 50], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-120, 50]), zoom: 6 }) }); diff --git a/examples/layer-group.js b/examples/layer-group.js index 4ec21fc23d..b145d1dffb 100644 --- a/examples/layer-group.js +++ b/examples/layer-group.js @@ -33,7 +33,7 @@ var map = new ol.Map({ renderer: exampleNS.getRendererFromQueryString(), target: 'map', view: new ol.View({ - center: ol.proj.transform([37.40570, 8.81566], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([37.40570, 8.81566]), zoom: 4 }) }); diff --git a/examples/layer-spy.js b/examples/layer-spy.js index 2eea7e344a..d1a55cd20e 100644 --- a/examples/layer-spy.js +++ b/examples/layer-spy.js @@ -18,7 +18,7 @@ var map = new ol.Map({ layers: [roads, imagery], target: 'map', view: new ol.View({ - center: ol.proj.transform([-109, 46.5], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-109, 46.5]), zoom: 6 }) }); diff --git a/examples/overlay.js b/examples/overlay.js index 0a3c2f89e8..8ede9224bd 100644 --- a/examples/overlay.js +++ b/examples/overlay.js @@ -21,7 +21,7 @@ var map = new ol.Map({ }) }); -var pos = ol.proj.transform([16.3725, 48.208889], 'EPSG:4326', 'EPSG:3857'); +var pos = ol.proj.fromLonLat([16.3725, 48.208889]); // Vienna marker var marker = new ol.Overlay({ diff --git a/examples/semi-transparent-layer.js b/examples/semi-transparent-layer.js index 6a3fd3c0e9..c4e67d0240 100644 --- a/examples/semi-transparent-layer.js +++ b/examples/semi-transparent-layer.js @@ -21,7 +21,7 @@ var map = new ol.Map({ renderer: exampleNS.getRendererFromQueryString(), target: 'map', view: new ol.View({ - center: ol.proj.transform([-77.93255, 37.9555], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-77.93255, 37.9555]), zoom: 5 }) }); diff --git a/examples/tile-vector.js b/examples/tile-vector.js index ad0e1213fd..245e8db64c 100644 --- a/examples/tile-vector.js +++ b/examples/tile-vector.js @@ -152,7 +152,7 @@ var map = new ol.Map({ renderer: 'canvas', target: document.getElementById('map'), view: new ol.View({ - center: ol.proj.transform([-74.0064, 40.7142], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-74.0064, 40.7142]), maxZoom: 19, zoom: 15 }) diff --git a/examples/wms-image-custom-proj.js b/examples/wms-image-custom-proj.js index ffb18ed36c..ad2376f306 100644 --- a/examples/wms-image-custom-proj.js +++ b/examples/wms-image-custom-proj.js @@ -75,7 +75,7 @@ var map = new ol.Map({ target: 'map', view: new ol.View({ projection: projection, - center: ol.proj.transform([8.23, 46.86], 'EPSG:4326', projection), + center: ol.proj.fromLonLat([8.23, 46.86], projection), extent: extent, zoom: 2 }) diff --git a/examples/xyz-esri.js b/examples/xyz-esri.js index 78bdeb1ec4..f4dbae1a78 100644 --- a/examples/xyz-esri.js +++ b/examples/xyz-esri.js @@ -23,7 +23,7 @@ var map = new ol.Map({ }) ], view: new ol.View({ - center: ol.proj.transform([-121.1, 47.5], 'EPSG:4326', 'EPSG:3857'), + center: ol.proj.fromLonLat([-121.1, 47.5]), zoom: 7 }) }); diff --git a/src/ol/proj/proj.js b/src/ol/proj/proj.js index 61991c9a2f..d8a13e17b9 100644 --- a/src/ol/proj/proj.js +++ b/src/ol/proj/proj.js @@ -586,6 +586,36 @@ ol.proj.removeTransform = function(source, destination) { }; +/** + * Transforms a coordinate from longitude/latitude to a different projection. + * @param {ol.Coordinate} coordinate Coordinate as longitude and latitude, i.e. + * an array with longitude as 1st and latitude as 2nd element. + * @param {ol.proj.ProjectionLike=} opt_projection Target projection. The + * default is Web Mercator, i.e. 'EPSG:3857'. + * @return {ol.Coordinate} Coordinate projected to the target projection. + * @api stable + */ +ol.proj.fromLonLat = function(coordinate, opt_projection) { + return ol.proj.transform(coordinate, 'EPSG:4326', + goog.isDef(opt_projection) ? opt_projection : 'EPSG:3857'); +}; + + +/** + * Transforms a coordinate to longitude/latitude. + * @param {ol.Coordinate} coordinate Projected coordinate. + * @param {ol.proj.ProjectionLike=} opt_projection Projection of the coordinate. + * The default is Web Mercator, i.e. 'EPSG:3857'. + * @return {ol.Coordinate} Coordinate as longitude and latitude, i.e. an array + * with longitude as 1st and latitude as 2nd element. + * @api stable + */ +ol.proj.toLonLat = function(coordinate, opt_projection) { + return ol.proj.transform(coordinate, + goog.isDef(opt_projection) ? opt_projection : 'EPSG:3857', 'EPSG:4326'); +}; + + /** * Fetches a Projection object for the code specified. * diff --git a/test/spec/ol/proj/proj.test.js b/test/spec/ol/proj/proj.test.js index 475ef18046..23d0440f89 100644 --- a/test/spec/ol/proj/proj.test.js +++ b/test/spec/ol/proj/proj.test.js @@ -78,7 +78,7 @@ describe('ol.proj', function() { describe('transform from 4326 to 3857 (Alastaira)', function() { // http://alastaira.wordpress.com/2011/01/23/the-google-maps-bing-maps-spherical-mercator-projection/ - it('returns expected value', function() { + it('returns expected value using ol.proj.transform', function() { var point = ol.proj.transform( [-5.625, 52.4827802220782], 'EPSG:4326', 'EPSG:900913'); expect(point).not.to.be(undefined); @@ -86,12 +86,20 @@ describe('ol.proj', function() { expect(point[0]).to.roughlyEqual(-626172.13571216376, 1e-9); expect(point[1]).to.roughlyEqual(6887893.4928337997, 1e-8); }); + + it('returns expected value using ol.proj.fromLonLat', function() { + var point = ol.proj.fromLonLat([-5.625, 52.4827802220782]); + expect(point).not.to.be(undefined); + expect(point).not.to.be(null); + expect(point[0]).to.roughlyEqual(-626172.13571216376, 1e-9); + expect(point[1]).to.roughlyEqual(6887893.4928337997, 1e-8); + }); }); describe('transform from 3857 to 4326 (Alastaira)', function() { // http://alastaira.wordpress.com/2011/01/23/the-google-maps-bing-maps-spherical-mercator-projection/ - it('returns expected value', function() { + it('returns expected value using ol.proj.transform', function() { var point = ol.proj.transform([-626172.13571216376, 6887893.4928337997], 'EPSG:900913', 'EPSG:4326'); expect(point).not.to.be(undefined); @@ -99,6 +107,14 @@ describe('ol.proj', function() { expect(point[0]).to.roughlyEqual(-5.625, 1e-9); expect(point[1]).to.roughlyEqual(52.4827802220782, 1e-9); }); + + it('returns expected value using ol.proj.toLonLat', function() { + var point = ol.proj.toLonLat([-626172.13571216376, 6887893.4928337997]); + expect(point).not.to.be(undefined); + expect(point).not.to.be(null); + expect(point[0]).to.roughlyEqual(-5.625, 1e-9); + expect(point[1]).to.roughlyEqual(52.4827802220782, 1e-9); + }); }); describe('transformExtent()', function() { @@ -139,6 +155,21 @@ describe('ol.proj', function() { delete proj4.defs['EPSG:21781']; }); + it('works with ol.proj.fromLonLat and ol.proj.toLonLat', function() { + proj4.defs('EPSG:21781', + '+proj=somerc +lat_0=46.95240555555556 +lon_0=7.439583333333333 ' + + '+k_0=1 +x_0=600000 +y_0=200000 +ellps=bessel ' + + '+towgs84=674.374,15.056,405.346,0,0,0,0 +units=m +no_defs'); + var lonLat = [7.439583333333333, 46.95240555555556]; + var point = ol.proj.fromLonLat(lonLat, 'EPSG:21781'); + expect(point[0]).to.roughlyEqual(600072.300, 1); + expect(point[1]).to.roughlyEqual(200146.976, 1); + point = ol.proj.toLonLat(point, 'EPSG:21781'); + expect(point[0]).to.roughlyEqual(lonLat[0], 1); + expect(point[1]).to.roughlyEqual(lonLat[1], 1); + delete proj4.defs['EPSG:21781']; + }); + it('caches the new Proj4js projections given their srsCode', function() { proj4.defs('EPSG:21781', '+proj=somerc +lat_0=46.95240555555556 +lon_0=7.439583333333333 ' +