-
Notifications
You must be signed in to change notification settings - Fork 0
docs: update documentation on transform function #124
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
EscapedGibbon
merged 16 commits into
main
from
123-update-documentation-on-transform-function
Jul 8, 2025
Merged
Changes from 15 commits
Commits
Show all changes
16 commits
Select commit
Hold shift + click to select a range
1fb669c
docs: wip add documentation on the new version of transform function
EscapedGibbon a43a30e
docs: add examples for affine transformation
EscapedGibbon b7c5d56
docs: modify projective transformation examples
EscapedGibbon 942a235
docs: add explanation and examples for projective transformation
EscapedGibbon 6cd2cb4
docs: fix spelling mistakes
EscapedGibbon 5f0df19
chore: modify exports in package.json
EscapedGibbon e23f98b
docs: add subtitle for types of transformation
EscapedGibbon 86dc5b4
docs: minor doc fixes
EscapedGibbon 8da604b
docs: resolve conversations
EscapedGibbon f760d2e
docs: explain z value of a coordinate
EscapedGibbon 9e400c3
docs: fix getPerspectiveWarp options
EscapedGibbon 4cadbab
docs: update getPerspectiveWarp
EscapedGibbon 8b0c0e8
chore: revert package-lock to main branch
stropitek 9799bd3
docs: move ml-matrix explanation
EscapedGibbon fe5a02e
chore: use same node version in CI
stropitek 2712e93
docs: resolve conversations
EscapedGibbon File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
--- | ||
sidebar_position: 41 | ||
--- | ||
|
||
# Get perspective warp matrix | ||
|
||
_Returns a perspective transformation matrix from source points that transforms a quadrilateral._ | ||
|
||
[Options and parameters of `getPerspectiveWarp` function](https://image-js.github.io/image-js-typescript/functions/getPerspectiveWarp.html) | ||
|
||
`getPerspectiveWarp` function takes 4 corner points (source quadrilateral) and then calculates the 3×3 perspective transformation matrix that allows removing [perspective distortion](https://en.wikipedia.org/wiki/Perspective_distortion). | ||
The function also returns width and height of the new image. | ||
If they were put as option's parameters it just returns indicated width and height, otherwise it calculates new width and height from given source points. | ||
|
||
### Basic use case | ||
|
||
```ts | ||
const image = readSync('path/to/file.png'); | ||
// Define source corners (original image points) and destination image width and height. | ||
// In this case they correspond to credit card's corner points. | ||
const sourcePoints = [ | ||
[ | ||
{ column: 55, row: 140 }, | ||
{ column: 680, row: 38 }, | ||
{ column: 840, row: 340 }, | ||
{ column: 145, row: 460 }, | ||
], | ||
{ width: 725, height: 425 }, | ||
]; | ||
|
||
// Get transformation matrix using 4 points and `getPerspectiveWarp` function. | ||
const projectionMatrix = getPerspectiveWarp(sourcePoints); | ||
const projectedImage = image.transform(matrix.matrix, { | ||
width: matrix.width, | ||
height: matrix.height, | ||
inverse: true, | ||
}); | ||
``` | ||
|
||
 | ||
|
||
### Parameters and default values | ||
|
||
- `pts` | ||
|
||
- `options` | ||
|
||
#### Options | ||
|
||
| Property | Required | Default value | | ||
| ----------------------------------------------------------------------------------------------------------- | -------- | ------------- | | ||
| [`width`](https://image-js.github.io/image-js-typescript/interfaces/GetPerspectiveWarpOptions.html#width) | no | - | | ||
| [`height`](https://image-js.github.io/image-js-typescript/interfaces/GetPerspectiveWarpOptions.html#height) | no | - | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.