
Security News
Create React App Officially Deprecated Amid React 19 Compatibility Issues
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
perspective-transform
Advanced tools
Access perspective transform functions and matrices given two sets of four points
A small JavaScript library for creating and applying perspective transforms. A perspective transform can easily be used to map one 2D quadrilateral to another, given the corner coordinates for the source and destination quadrilaterals. Here is a useful resource for learning more about perspective transforms and the math behind them. And here is a blog post I wrote about the motivation for creating this library and details of some of its applications.
With npm:
$ npm install perspective-transform --save
With bower:
$ bower install perspective-transform --save
var PerspT = require('perspective-transform');
var srcCorners = [158, 64, 494, 69, 495, 404, 158, 404];
var dstCorners = [100, 500, 152, 564, 148, 604, 100, 560];
var perspT = PerspT(srcCorners, dstCorners);
var srcPt = [250, 120];
var dstPt = perspT.transform(srcPt[0], srcPt[1]);
// [117.27521125839255, 530.9202410878403]
<script type="text/javascript" src="async.js"></script>
<script type="text/javascript">
var srcCorners = [158, 64, 494, 69, 495, 404, 158, 404];
var dstCorners = [100, 500, 152, 564, 148, 604, 100, 560];
var perspT = PerspT(srcCorners, dstCorners);
var srcPt = [250, 120];
var dstPt = perspT.transform(srcPt[0], srcPt[1]);
// [117.27521125839255, 530.9202410878403]
</script>
Note: Commented variable values in the following examples assume srcPts
and dstPts
as used in the Basic Usage example above.
Map a point from the source quadrilateral to the destination quadrilateral.
var perspT = PerspT(srcPts, dstPts);
var dstPt = perspT.transform(250, 120);
// [117.27521125839255, 530.9202410878403]
### transformInverse
Map a point from the destination quadrilateral to the source quadrilateral.
var perspT = PerspT(srcPts, dstPts);
var srcPt = perspT.transformInverse(130, 570);
// [338.99465637447327, 278.6450957956236]
### srcPts
Get the coordinates of the corners of the transform's source quadrilateral, expressed as an array.
var perspT = PerspT(srcPts, dstPts);
var srcPts = perspT.srtPts;
// [158, 64, 494, 69, 495, 404, 158, 404]
### dstPts
Get the coordinates of the corners of the transform's destination quadrilateral, expressed as an array.
var perspT = PerspT(srcPts, dstPts);
var dstPts = perspT.dstPts;
// [100, 500, 152, 564, 148, 604, 100, 560]
### coeffs
Get the homographic transform matrix, expressed as an array of coefficients.
var perspT = PerspT(srcPts, dstPts);
var mat = perspT.coeffs;
// [0.3869749384, 0.0426817448, 59.2427947969, 0.9589610618, 0.4562821238, 434.8644299345, 0.0012901794, 0.0004268174, 1]
### coeffsInv
Get the inverse homographic transform matrix, expressed as an array of coefficients.
var perspT = PerspT(srcPts, dstPts);
var mat = perspT.coeffsInv;
// [1.9955408809, -0.1282507787, -62.4497171511, -2.9335671323, 2.2894572644, -821.8108124927, -0.0013225082, -0.0008117138, 1]
FAQs
Access perspective transform functions and matrices given two sets of four points
The npm package perspective-transform receives a total of 816 weekly downloads. As such, perspective-transform popularity was classified as not popular.
We found that perspective-transform demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
Security News
The Linux Foundation is warning open source developers that compliance with global sanctions is mandatory, highlighting legal risks and restrictions on contributions.