Class: WebCodecView

WebCodecView(propertiesopt)

This class is in charge of displaying H264 data by decoding ffmpeg.js library and displaying into them a YUV canvas.

Constructor

new WebCodecView(propertiesopt)

Create a View.
Parameters:
Name Type Attributes Default Description
properties Object <optional>
 {} the properties of the view
Properties
Name Type Attributes Default Description
container string The div element to attach to
css string The css classes to set, can be multiple if separate by spaces
visible boolean set the default behavior of the visibility of the view
layers Array.<Object> <optional>
 [] The initial layers to add
showTime Boolean <optional>
 false Enable or ignore the show timestamp text onto the canvas
showStats Boolean <optional>
 false Enable or ignore the display stats (FPS number) onto the canvas
codec String <optional>
 'h264' Video codec
Source:
Example
import WebCodecView from 'core/ui/view/video/WebCodecView.js';

 let videoView = new WebCodecView({
  container: 'video-h264-container',
  css: 'video-h264',
  name: 'UAV Video',
  layers: [
      new DataLayer({
        dataSourceId: videoDataSource.id,
        getFrameData: (rec) => rec.videoFrame,
        getTimestamp: (rec) => rec.timestamp
      })
  ]
});

Extends

Methods

(protected) createCanvas(width, height, style)

Create DOM element with some height/width/style
Parameters:
Name Type Description
width String the width
height String the height
style String the dom element style (Optional)
Source:

reset()

Reset the view by drawing no data array into the YUV canvas.
Source:

updateStatistics()

Overrides:
Source:

Events

onAfterDecoded

Called after each decoded frame.
Overrides:
Source: