# FFMPEG

The FFMPEG view allows you to display video-type data. The lib is based on FFMPEG.js which is a port of the native FFMPEG C++ library using emscripten (opens new window).

More information: https://github.com/mdhsl/ffmpeg.js (opens new window)


API Reference

# Supported layers

The view supports type layers:

  • data

# Limitation

The view theoretically decodes all types of video streams supported by FFMPEG. Due to the limitation of emscripten and WebAssembly, the Javascript library does not support hardware decoding. So processing is completely handled by the CPU.

However, it is possible to display almost twenty H264 videos in parallel, since CPU decoding is optimized by the CPU instructions themselves.

# Example

import SosGetResultVideo from 'osh-js/core/datasource/SosGetResultVideo.js';
import FFMPEGView from 'osh-js/core/ui/view/video/FFMPEGView.js';
// create data source for UAV camera
let videoDataSource = new SosGetResultVideo("drone-Video", {
  protocol: "ws",
  service: "SOS",
  endpointUrl: "sensiasoft.net:8181/sensorhub/sos",
  offeringID: "urn:mysos:solo:video2",
  observedProperty: "http://sensorml.com/ont/swe/property/VideoFrame",
  startTime: "2015-12-19T21:04:30Z",
  endTime: "2015-12-19T21:09:19Z",
  replaySpeed: 1
});

// show it in video view using FFMPEG JS decoder
let videoView = new FFMPEGView({
  container: 'video-h264-container',
  css: 'video-h264',
  name: 'UAV Video',
  framerate:25,
  showTime: true,
  showStats: true,
  dataSourceId: videoDataSource.id
});

// start streaming
videoDataSource.connect();