Monday, 27 August 2018

javascript - Using the Proj4js library to convert from Google Maps to projected values


I'm using the proj4s javascript library (based on advice from this question I asked previously) to convert lat/long values on my webpage. This page receives the lat/long values from google maps and converts them to the British National Grid (ORD SURV GB), which wikipedia tells me has the following code: EPSG:27700. I want to calculate the maximum and minimum values of both the latitude and longitude, so I can query a database.



My code is as follows:


var source = new Proj4js.Proj('WGS84');    
var dest = new Proj4js.Proj('EPSG:27700');

bounds = map.getBounds() // Get bounds of map after user pans around
zoom = map.getZoom() // Get zoom level

xMax = bounds.getNorthEast().lat() //get max and min values for lat/long
yMax = bounds.getNorthEast().lng()
xMin = bounds.getSouthWest().lat()

yMin = bounds.getSouthWest().lng()

alert('xMin: ' + xMin + '\nxMax: ' + xMax)
alert('yMin: ' + yMin + '\nyMax: ' + yMax)

// transforming point coordinates
var latXNew = new Proj4js.Point( xMin, xMax );
var latYNew = new Proj4js.Point( yMin, yMax );

Proj4js.transform(source, dest, latXNew);

Proj4js.transform(source, dest, latYNew);

However, I'm not getting the correct results from my webpage. I've loaded in a kml file that has a rectangle with boundaries that I know, and the values don't match up. They appear to be off by at least a factor of approximately 8.


NE Lat: 52.25635981528854
NE Lng: 1.3534606328125243

Expected Lat: 500000.0
Expected Lng: 150000.0

Returned Lat: -5527596.989640327 (incorrect)

Returned Lng: 622727.1071581601 (incorrect)

What am I doing incorrectly?



Answer



Make sure that you're converting the correct value when performing the transformation.


You're creating new Points using the same axis. Try this:


// transforming point coordinates   
var southWestOld = new Proj4js.Point( xMin, yMin );
var northEastOld = new Proj4js.Point( xMax, yMax );


var southWestNew = Proj4js.transform(source, dest, southWestOld);
var northEastNew = Proj4js.transform(source, dest, northEastOld);

Also, speaking convention is to say "x,y" or "lat,long" but the x coordinate is usually Easting (longitude) and y is usually Northing (latitude).


If using the right coordinates still does not produce the expected result, try switching lat and long and see if your numbers land where you expect.


For the following code I am not getting the values you expect, but I am getting values that agree with the calculator found here: http://www.nearby.org.uk/tests/GeoTools.html


Proj4js.defs["WGS84"] = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
Proj4js.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";

var source = new Proj4js.Proj('WGS84');

var dest = new Proj4js.Proj('EPSG:27700');

var testPt = new Proj4js.Point(1.3534606328125,52.25635981528);

Proj4js.transform(source, dest, testPt);

My result coordinate is 628970.515543512,267319.1785250341, and the one from the website is TM 28971 67319.


No comments:

Post a Comment

arcpy - Changing output name when exporting data driven pages to JPG?

Is there a way to save the output JPG, changing the output file name to the page name, instead of page number? I mean changing the script fo...