arcodange/mediabunny
1
0
Fork 0
mirror of https://github.com/arcodange-org/mediabunny.git synced 2026-10-03 13:53:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: add video crop option

Browse Source
This commit is contained in:
Pablo Cúbico
2025-09-05 07:07:43 -03:00
committed by Pablo Cuadrado
parent 605c258029
commit 904fd8f95e
6 changed files with 323 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/guide/media-sinks.md
+5 -2
View File
@@ -314,7 +314,7 @@ for await (const sample of keyFrameSamples) {
### `CanvasSink`
While `VideoSampleSink` extracts raw decoded video samples, you can use `CanvasSink` to extract these samples as canvases instead. In doing so, certain operations such as scaling and rotating can also be handled by the sink. The downside is the additional VRAM requirements for the canvases' framebuffers.
While `VideoSampleSink` extracts raw decoded video samples, you can use `CanvasSink` to extract these samples as canvases instead. In doing so, certain operations such as cropping, scaling, and rotating can also be handled by the sink. The downside is the additional VRAM requirements for the canvases' framebuffers.
::: info
This sink yields `HTMLCanvasElement` whenever possible, and falls back to `OffscreenCanvas` otherwise (in Worker contexts, for example).
@@ -330,6 +330,7 @@ const sink = new CanvasSink(videoTrack, options);
Here, `options` has the following type:
```ts
type CanvasSinkOptions = {
crop?: { left: number; top: number; width: number; height: number };
width?: number;
height?: number;
fit?: 'fill' | 'contain' | 'cover';
@@ -337,6 +338,8 @@ type CanvasSinkOptions = {
poolSize?: number;
};
```
- `crop`\
Crops the source frame to the specified rectangle before any rotation or resizing is applied. Portions outside the original frame are filled with black.
- `width`\
The width of the output canvas in pixels. When omitted but `height` is set, the width will be calculated automatically to maintain the original aspect ratio. Otherwise, the width will be set to the original width of the video.
- `height`\
@@ -347,7 +350,7 @@ type CanvasSinkOptions = {
- `'contain'` will contain the entire image within the box while preserving aspect ratio. This may lead to letterboxing.
- `'cover'` will scale the image until the entire box is filled, while preserving aspect ratio.
- `rotation`\
The clockwise rotation by which to rotate the raw video frame. Defaults to the rotation set in the file metadata. Rotation is applied before resizing.
The clockwise rotation by which to rotate the raw video frame. Defaults to the rotation set in the file metadata. Rotation is applied after cropping and before resizing.
- `poolSize`\
See [Canvas pool](#canvas-pool).