首页 > 解决方案 > 从网络摄像头 Ext JS 捕获图片

问题描述

我在这里遇到了本教程: https ://github.com/mdn/samples-server/blob/master/s/webrtc-capturestill/capture.js

但是,我无法将其实现到我的代码中,并且正在寻求一些帮助......

我基本上想要一个面板,您可以在其中按下“拍照”按钮。然后这将打开一个新的浮动面板,其中网络摄像头的实时流将自动启动,并且您有一个捕获图像的按钮。

    takePicture: function (photoPanel)
    {
        let me = this;

        let capture = Ext.create('Ext.panel.Panel', {
            title: 'Take Picture',
            height: 500,
            width: 750,
            draggable: true,
            closable: true,
            floating: true,
            layout: {
                type: 'vbox',
                pack: 'center',
                align: 'middle'
            },
            items: [
                {
                    xtype: 'container',
                    itemId: 'video',
                    height: 400,
                    width: 350
  // this is where I want the live webcam to stream
                },
                {
                    xtype: 'button',
                    text: 'Take Picture',
                    itemId: 'startbutton',
                    handler: function (btn)
                    {

                    }
    // button to capture the image
                }
            ]
        });
        photoPanel.add(capture).show();
    },

标签: javascriptextjswebcam

解决方案


我做了一个简单的小提琴,根据提供的脚本捕捉照片


推荐阅读