mat-grid-tile не отображает видеопоток ipwebcam - PullRequest
Новая
       70

mat-grid-tile не отображает видеопоток ipwebcam

0 голосов
/ 19 апреля 2020

Я пытаюсь отобразить видеопоток ipwebcam в сетках в angular, используя mat-grid-tile , но видео не отображается. Если я использую его без мат-сетки, то он работает и отображает видео; но я хочу отобразить его в формате сетки, поэтому, пожалуйста, помогите мне в этом. Заранее спасибо.

.ts content 

cameraID = [1,2,3,4]

streamVideo(){
        let canvas = document.getElementById('video');

        let player = new JSMpeg.Player("ws://localhost:9999", {canvas:canvas, autoplay:true,audio:false,loop: true });

      }

. html content 

<mat-grid-list cols="2" rowHeight="2:1.5" gutterSize="1.5rem">
    <mat-grid-tile *ngFor="let cam of cameraID" class="mat-elevation-z8">
        <mat-grid-tile-header>Camera {{ cam }}</mat-grid-tile-header>
        <canvas class="camera" id="video" ></canvas>
    </mat-grid-tile>
  </mat-grid-list>

. css content 

 canvas {
    display: block;
    float: left;
    transform: scale(1);
   transform-origin: 0% 0% 0px;
  }
  .camera{
    display: block;
    padding: 0px;
    width: 400px;
    height: 300px;
  }

бэкэнд-контент 

Stream = require('node-rtsp-stream')

stream = new Stream({
  name: 'name',
  streamUrl: 'rtsp://192.168.43.1:8080/h264_ulaw.sdp',
  wsPort: 9999,
  ffmpegOptions: { // options ffmpeg flags
    '-stats': '', // an option with no neccessary value uses a blank string
    '-r': 30 // options with required values specify the value after the key
  }
})
...