How to read PostGIS point in JavaScript? - javascript

I am currently getting PostGIS points at client side using JavaScript, is there a way to convert those points into ordinary x, y coordinates using JavaScript?
Here is how I get the points currently:
0101000020E6100000DE02098A1FF33F40BADA8AFD65F74140

You haven't posted your actual query, but if you wrap the geometry referenced in your SELECT statement with ST_AsText() then it will return the geometry in a human readable format called Well Known Text.
e.g.
SELECT my_id, ST_AsText(my_geom) FROM my_table;
-- returns POINT(31.9497 35.9328) using the geometry from your question.
This is then fairly ordinary parsing exercise. Or, if you just want the raw lon / lat (or easting / northing), then structure your query like this:
SELECT ST_X(my_geom), ST_Y(my_geom) FROM my_table;
-- returns: 31.9497, 35.9328 using the geometry from your question
Note that you can also transform the geometry, if necessary, to the coordinate system that you need to use. For example, if the geometry is stored in the database in conventional lon/lat format (EPSG code 4326) and you need to retrieve it in the Pseudo Mercator Projection ordinarily used in online maps (EPSG code 3857), then you need to do this:
-- note the explicit ::geometry cast
SELECT my_id, ST_AsText(ST_Transform(my_geom::geometry, 3857)) FROM my_table;
For fun, you can try this in a PostGIS enabled Postgres SQL query window (using the geometry from your question):
Return as WKT:
SELECT ST_AsText('0101000020E6100000DE02098A1FF33F40BADA8AFD65F74140');
-- returns: POINT(31.9497 35.9328)
Return as Pseudo Mercator:
SELECT ST_AsText(ST_Transform('0101000020E6100000DE02098A1FF33F40BADA8AFD65F74140'::geometry, 3857))
-- returns: POINT(3556624.33499785 4291378.69099916)
Return as X, Y:
SELECT ST_X('0101000020E6100000DE02098A1FF33F40BADA8AFD65F74140'),
ST_Y('0101000020E6100000DE02098A1FF33F40BADA8AFD65F74140');
-- returns: 31.9497, 35.9328

Related

What is the Ideal way to create a Triangle-Coordinates in Google Map API with two location points consisting of latitude & longitude

I have a scenario in my JavaScript application where I have the coordinates of a starting point which consist of Latitude and Longitude, similarly an ending point with it's respective coordinates.
Now I need to search for a location which basically provides with a set of coordinates and find if the recently entered location lies in between the previously mentioned starting point or ending point. However, the location does not need to match exactly within the points of the path of the start and end point. That is even if the location lies around the distance of say 2-3 km from the derived path, it should give a match.
I believe that we can create a triangle by providing three coordinates i.e start-point, end-point and a third point. So once the triangle is formed we can use google.maps.geometry.poly.containsLocation method to find if our searched location is present inside this triangle.
So my question is how can we get a third point to create a triangle which will provide locations that are nearby within 2-3 km from start to end point.
Else is there any alternate approach to deal with my use case?
Use googlemap's geometry library
This function specifically
isLocationOnEdge
Here's an example
0.001 tolerance value would be 100m
var isLocationNear = google.maps.geometry.poly.isLocationOnEdge(
yourLatLng,
new google.maps.Polyline({
path: [
new google.maps.LatLng(point1Lat, point1Long),
new google.maps.LatLng(point2Lat, point2Long),
]
}),
.00001);
Please note that the following answer assumes Plane Geometry where you should be using Spherical Geometry instead. Although this will be fine for less accurate purposes (like approximate distance, etc..)
It seems more of a geometry question than a programming question. A triangle like you mentioned won't be able to cover a straight line path in a uniform way. The situation can be thought of more like a distance between point and a line problem (Refer the given diagram
Here you can just find the distance between point C and line AB which you can check whether it's below 2.5 KMs (I've omitted all the units and conversions for simplicity)
Please note that you will also need to convert the distances from radian to appropriate units that you require using haversine formula, etc. which is not a trivial task (https://www.movable-type.co.uk/scripts/latlong.html).

Javascript Runtime Error Involving Value Not Written in Code

I am using App Lab on Code.org, which utilizes JavaScript commands; however, they have their own UI controls. Therefore, the code will contain commands such as onEvent() and setText(), etc. etc. These are all acceptable.
I am attempting to make a code for the Spherical Law of Cosines that calculates the distance between four different locations, but I am getting a runtime error message stating this: "Line: 171: Oops, we can’t figure out what -0.9208185005422157 is - perhaps you meant the string “-0.9208185005422157” with quotes? If this is meant to be a variable, make sure you declared a variable: var -0.9208185005422157."
The line in reference is as follows:
N = Math.acos((((((Math.abs(Math.cos(a)))*(Math.PI/180))*(Math.abs((Math.cos(b)(Math.PI/180))))+(((Math.abs(Math.sin(a)*(Math.PI/180)))+((Math.abs(Math.sin(b)*(Math.PI/180)))))*(((Math.abs(Math.cos(n))*(Math.PI/180)))))))));
Basically, I'm trying to find the value of the angle between two locations using the Spherical Law of Cosines, so I converted all of my values to degrees.
What would cause the error to log a random value in that line that I did not write?
It seems that you are missing a *
Math.cos(b)(Math.PI/180)
should be
Math.cos(b)*(Math.PI/180)

Node.js/Javascript library to test if point is in geojson multipolygon

Is there some library for node.js or javascript in general that provides a function to check if a coordinate is in a geojson multipolygon?
I'm trying to create a small HTTP API that tells me which multipolygons (representing countries, counties, cities, etc.) contain a given coordinate.
I thought that I'll hold a list of all multipolygons & their bounding-box in memory and then first check for each polygon if its bounding box cointains the coordinate. If yes, then it'll check if the coordinate is in the multipolygon itself.
I know there's a library called "clipper" that got ported to javascript, but it seems that the library does not provide a simple "pointInPolygon" function, even if the library itself is very powerful.. Is it still possible with this library?
Additionally, I've found another library called "geojson-js-utils" but it does not seem to support multipolygons (at least it's not mentioned there)
I've found some other libraries that can check if a point is in a polygon, but I don't know how to use them to check if a point is in a multipolygon.
Any hints?
In newest Clipper there is an efficient PointInPolygon function. It uses algorithm The Point in Polygon Problem for Arbitrary Polygons by Hormann & Agathos.
The documentation of Javascript Clipper's PointInPolygon function says:
ClipperLib.Clipper.PointInPolygon()
Number PointInPolygon(IntPoint pt, Path poly)
Returns 0 if false, -1 if pt is on poly and +1 if pt is in poly.
Usage:
var poly = [{X:10,Y:10},{X:110,Y:10},{X:110,Y:110},{X:10,Y:110}];
var pt = new ClipperLib.IntPoint(50,50);
var inpoly = ClipperLib.Clipper.PointInPolygon(pt, poly);
// inpoly is 1, which means that pt is in polygon
To test multipolygon, you can traverse subpolygons and check them using PointInPolygon.

Create SVGPoint inside an element with user coordinate

I have a small project (to learn SVG) running (using javascript).
I would like to be able to track a point in a shape with its own user coordinate system. My idea is to find the coordinates of the point within the shape, then create an SVGPoint, so that I can pass on that element. I have seen the method create SVGPoint in examples, but it seems it is used in the context of the 'SVG_root' (that is, document.documentElement.createSVGPoint() works).
When I use (in Firefox)
inSvgObj.createSVGPoint()
where inSVGObj is a element, the web console says "TypeError: inSvgObj.createSVGPoint is not a function". Is it possible to create an SVG point within the to subsequently set with values representing coordinates in that 's user coordinate system?
EDIT (after considernig Robert Longson's answer):
Given that SVGPoint is created only within an "SVG root" and that I have been unable to find a way to move that to within another element, I have found more convenient to use a different svg element type: SVGMatrix. In case it helps someone (as I have spent some time trying to deal with this),It is possible to manipulate analogue values inside an SVG Point by creating an SVGMatrix that would work as a simulated point (for the purposes of coordinates. To that endthe methods .createSVGMatrix(), getCTM() and.multiply() (this last from SVGMatrix) are used. To illustrate that, I will include a (js) function that takes 4 arguments: x-coordinate in user coordinate system (ucs) to transform, y-coordinate is that ucs, object whose ucs is the want we want to transform and an object in the ucs we want to transform to; and returns am object with thrre poperties the x-coordinate in the transformed ucs, its y-coordinate and 1 (for consistency with SVG Recommendations).
function coorUcsAToUcsB(ucsAx,ucsAy,svgObjUcsA,svgObjUcsB){
var ctmUcsA=svgObjUcsA.getCTM();
var ctmUcsB=svgObjUcsB.getCTM().inverse();
var mtx=document.getElementsByTagName('svg')[0].createSVGMatrix();
mtx.e=ucsAx;
mtx.f=ucsAy;
var simulSvgP=ctmUcsB.multiply(ctmUcsA.multiply(mtx)); //1
return {"x":simulSvgP.e,"y":simulSvgP.f,"z":1};
}
//1 this line creates an svg matrix with 1st and 2nd column at 0, 3rd with coordinates of ucsB from the analogue svg matrix with coordinates in ucsA - it takes the coordinates in ucsA to viewport's cs and from there to coordinates in ucsB. For the matrix operation explanation, see this.
Any comments, in particular having overlooked a existing method that does the same or any drawbacks, will be more than welcome.
You create the SVG Point using the root element creation but once you've done that you can set whatever values in it you want. When you assign those values to an object the object will interpret them in its coordinate system.

Convert Zigfu joint position from Real World to Projective like in OpenNI

OpenNI provides the function ConvertRealWorldToProjective which lets you easily convert real world (x,y,z) joint positions, in mm, to a projected (x,y) position in pixels for a given viewport. This is really useful for drawing a 'skeleton' over the webcam feed.
Is this functionality exposed by ZigJS, either as a function or perhaps already converted somewhere? I can't find any mention of it in the docs, but I had luck with a previously undocumented feature with Zigfu in the past.
user.addEventListener('userupdate', function(user) {
var real = user.skeleton[zig.Joint.Head].position; // this is real world coordinate
// anything exposed by zigfu to convert to real world?
});
If not provided by Zigfu, does anyone know of a good JavaScript library that provides this sort of functionality?
ZigJS exposes two (unfortunately still undocumented) methods: convertImageToWorldSpace and convertWorldToImageSpace. They both accept an array of coordinates where every 3 elements represent a single point, and they return the converted points.
EDIT
To save anyone else the trial and error, it is the embedded object, not zig itself that has the undocumented methods. Example:
var zigObj = zig.findZigObject();
user.addEventListener('userupdate', function(user) {
var real = user.skeleton[zig.Joint.Head].position;
var projective = zigObj.convertWorldToImageSpace(real);
// do something with the converted position, like drawing it over the webcam
});

Categories

Resources