Baseline 2024 *
Newly available
VideoFrame()
ã³ã³ã¹ãã©ã¯ã¿ã¼ã¯ãåç»ã®ãã¬ã¼ã ã表ã VideoFrame
ãªãã¸ã§ã¯ããçæãã¾ãã
new VideoFrame(image)
new VideoFrame(image, options)
new VideoFrame(data, options)
弿°
æåã®åã®ã³ã³ã¹ãã©ã¯ã¿ã¼ï¼ä¸è¿°ï¼ã¯ãç»åããæ°ãã VideoFrame
ã使ãã¾ãã弿°ã¯ä»¥ä¸ã®ã¨ããã§ãã
image
æ°ãã VideoFrame
ã®ç»åãã¼ã¿ãæ ¼ç´ããç»åã SVGImageElement
, HTMLVideoElement
, HTMLCanvasElement
, ImageBitmap
, OffscreenCanvas
, ä»ã® VideoFrame
ã®ãªãã¸ã§ã¯ãã®ããããã«ãªãã¾ãã
options
çç¥å¯
以ä¸ã®ãã®ãå«ããªãã¸ã§ã¯ãã§ãã
duration
çç¥å¯
ãã¬ã¼ã ã®åçæéããã¤ã¯ãç§åä½ã§è¡¨ãæ´æ°ã
timestamp
ãã¬ã¼ã ã®ã¿ã¤ã ã¹ã¿ã³ãããã¤ã¯ãç§åä½ã§è¡¨ãæ´æ°ã
alpha
çç¥å¯
ã¢ã«ãã¡ãã£ã³ãã«ãæ±ãã¨ãã«ã¦ã¼ã¶ã¼ã¨ã¼ã¸ã§ã³ããã©ã®ããã«æ¯ãèãã¹ãããè¨è¿°ããæååãæ¢å®å¤ã¯ "keep" ã§ãã
"keep"
: ã¦ã¼ã¶ã¼ã¨ã¼ã¸ã§ã³ããã¢ã«ãã¡ãã£ã³ãã«ãã¼ã¿ãä¿åãããã¨ã示ãã¾ãã"discard"
: ã¦ã¼ã¶ã¼ã¨ã¼ã¸ã§ã³ããã¢ã«ãã¡ãã£ã³ãã«ãç¡è¦ã¾ãã¯é¤å»ãã¹ããã¨ã示ãã¾ããvisibleRect
çç¥å¯
VideoFrame
ã®å¯è¦é·æ¹å½¢ã表ããªãã¸ã§ã¯ãã§ã次ã®ãã®ãå«ã¿ã¾ãã
x
X 座æ¨ã
y
Y 座æ¨ã
width
ãã®ãã¬ã¼ã ã®å¹ ã
height
ãã®ãã¬ã¼ã ã®é«ãã
displayWidth
çç¥å¯
ã¢ã¹ãã¯ãæ¯èª¿æ´å¾ã«è¡¨ç¤ºããã VideoFrame
ã®å¹
ã
displayHeight
çç¥å¯
ã¢ã¹ãã¯ãæ¯èª¿æ´å¾ã«è¡¨ç¤ºããã VideoFrame
ã®é«ãã
2 ã¤ç®ã®ã³ã³ã¹ãã©ã¯ã¿ã¼ï¼ä¸è¨åç
§ï¼ã¯ãæ°ãã VideoFrame
ã ArrayBuffer
ãã使ãã¾ãã弿°ã¯ä»¥ä¸ã®éãã§ãã
data
æ°ãã VideoFrame
ã®ãã¼ã¿ãä¿æãã ArrayBuffer
ãTypedArray
ãDataView
ã®ããããã§ãã
options
以ä¸ã®ãã®ãæã¤ãªãã¸ã§ã¯ãã§ãã
format
åç»ã®ãã¯ã»ã«å½¢å¼ã表ãæååã以ä¸ã®æååã®ããããã§ãå®å
¨ãªèª¬æã¯ format
ããããã£ã®ãã¼ã¸ã«ããã¾ãã
"I420"
"I420A"
"I422"
"I444"
"NV12"
"RGBA"
"RGBX"
"BGRA"
"BGRX"
codedWidth
ãã¯ã»ã«åä½ã® VideoFrame
ã®å¹
ï¼ä¸å¯è¦ã®ããã£ã³ã°ãå«ãå¯è½æ§ããããæ¯çã®èª¿æ´ãèæ
®ããåã®å¤ï¼ã
codedHeight
ãã¯ã»ã«åä½ã® VideoFrame
ã®é«ãï¼ä¸å¯è¦ã®ããã£ã³ã°ãè¨è¼ããå¯è½æ§ããããæ¯ç調æ´ãèæ
®ããåã®å¤ï¼ã
timestamp
ãã¬ã¼ã ã®ã¿ã¤ã ã¹ã¿ã³ãããã¤ã¯ãç§åä½ã§è¡¨ãæ´æ°ã
duration
çç¥å¯
ãã¬ã¼ã ã®åçæéããã¤ã¯ãç§åä½ã§è¡¨ãæ´æ°ã
layout
çç¥å¯
VideoFrame
å
ã®åãã¬ã¼ã³ã«ã¤ãã¦ã以ä¸ã®å¤ãæ ¼ç´ãããªã¹ãã
offset
æå®ããããã¬ã¼ã³ãå§ã¾ããã¤ãåä½ã®ãªãã»ãããè¡¨ãæ´æ°ã
stride
ãã¬ã¼ã³ã®åè¡ã使ç¨ãããã¤ãæ°ï¼ããã£ã³ã°ãå«ãï¼ãè¡¨ãæ´æ°ã ãã¬ã¼ã³ãéãªã£ã¦ã¯ããã¾ããã layout
ãæå®ããªãå ´åããã¬ã¼ã³ã¯ããéãªãããã¯ããã¾ãã
visibleRect
çç¥å¯
VideoFrame` ã®å¯è¦é·æ¹å½¢ã表ããªãã¸ã§ã¯ãã§ã以ä¸ã®ãã®ãå«ã¿ã¾ãã
x
X 座æ¨ã
y
Y 座æ¨ã
width
ãã®ãã¬ã¼ã ã®å¹ ã
height
ãã®ãã¬ã¼ã ã®é«ãã
displayWidth
çç¥å¯
ã¢ã¹ãã¯ãæ¯èª¿æ´å¾ã«è¡¨ç¤ºããã VideoFrame
ã®å¹
ã
displayHeight
çç¥å¯
ã¢ã¹ãã¯ãæ¯èª¿æ´å¾ã«è¡¨ç¤ºããã VideoFrame
ã®é«ãã
colorSpace
VideoFrame` ã®è²ç©ºéã表ããªãã¸ã§ã¯ãã§ã以ä¸ã®ãã®ãå«ã¿ã¾ãã
primaries
æååã§ã VideoColorSpace.primaries
ããããã£ã®ãã¼ã¸ã§è¨è¿°ããã¦ãããåç»ã®è²ã®ãã©ã¤ããªã¼ã表ãã¾ãã
transfer
æååã§ã VideoColorSpace.transfer
ããããã£ã®ãã¼ã¸ã§è¨è¿°ããã¦ãããåç»ã®è²å¤æé¢æ°ã表ãã¾ãã
matrix
æååã§ã VideoColorSpace.matrix
ããããã£ã®ãã¼ã¸ã§è¨è¿°ããã¦ãããåç»ã®è²è¡åã表ãã¾ãã
fullRange
è«çå¤ã§ãã true
ã®å ´åããã«ã¬ã³ã¸ã®è²å¤ã使ç¨ããã¦ãããã¨ç¤ºãã¾ãã
transfer
VideoFrame
ãåãé¢ãã¦æææ¨©ãåã ArrayBuffer
ã®é
åãé
åã« data
ããããã³ã°ãã ArrayBuffer
ãæ ¼ç´ããã¦ããå ´åãVideoFrame
ã¯ãã®ãããã¡ã¼ããã³ãã¼ããã®ã§ã¯ãªãããã®ãããã¡ã¼ãç´æ¥ä½¿ç¨ãã¾ãã
次ã®ä¾ã¯ WebCodecs ã«ããåç»å¦çã®è¨äºããå¼ç¨ãã¦ãã¾ãããã®æåã®ä¾ã§ã¯ããã£ã³ãã¹ãã VideoFrame
ã使ãã¦ãã¾ãã
const cnv = document.createElement("canvas");
// draw something on the canvas
// ...
let frame_from_canvas = new VideoFrame(cnv, { timestamp: 0 });
In the following example a VideoFrame
is created from a TypedArray
.
const pixelSize = 4;
let init = {
timestamp: 0,
codedWidth: 320,
codedHeight: 200,
format: "RGBA",
};
let data = new Uint8Array(init.codedWidth * init.codedHeight * pixelSize);
for (let x = 0; x < init.codedWidth; x++) {
for (let y = 0; y < init.codedHeight; y++) {
let offset = (y * init.codedWidth + x) * pixelSize;
data[offset] = 0x7f; // Red
data[offset + 1] = 0xff; // Green
data[offset + 2] = 0xd4; // Blue
data[offset + 3] = 0x0ff; // Alpha
}
}
init.transfer = [data.buffer];
let frame = new VideoFrame(data, init);
仿§æ¸ ãã©ã¦ã¶ã¼ã®äºææ§
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4