v138 · webcodecs · video
Orientation Gallery
All eight EXIF/HEIF orientation values rendered side by side using VideoFrame orientation metadata — the new Chrome 138 feature. Each frame is created with a different displayWidth/displayHeight and orientation transform, drawn to a canvas, then decoded to show how the metadata affects display.
Orientation gallery
VideoFrame.rotation:
Checking…
// Chrome 138: VideoFrame now carries orientation metadata
const frame = new VideoFrame(imageBitmap, {
timestamp: 0,
rotation: 90, // 0 | 90 | 180 | 270
flip: false // horizontal flip
});
// Read back orientation metadata
console.log(frame.rotation); // 90
console.log(frame.displayWidth); // rotated logical width
console.log(frame.displayHeight); // rotated logical height
// Canvas drawImage consumes the VideoFrame display orientation
canvas.width = frame.displayWidth;
canvas.height = frame.displayHeight;
canvas.getContext('2d').drawImage(frame, 0, 0);
Why it matters: Mobile video is often recorded in portrait mode and stored
with an EXIF orientation tag. When decoded via WebCodecs, the raw pixel data is in the
camera's sensor orientation. Chrome 138 adds
rotation and flip
properties to VideoFrame so decoders can propagate orientation metadata and
renderers can apply the correct transform without parsing codec-level containers.