使用HTML5的网络摄像头操作
一个操纵网络摄像头的AngularJS指令。
您可以轻松地将其作为模块添加到自己的应用程序中。
可以在http://jonashartmann.*gi*t*hub.io/webcam-directive(GH-pages)上找到一个完整的示例
下载
使用NPM
npm install webcam使用Bower
bower install webcam-directive每个版本都有一个标签,在DIST目录中具有构建的JavaScript文件
Ex.: dist/webcam.min.js
安装
使用脚本标签
< script type =" text/javascript " src =" webcam.min.js " > script > 用法
将模块“网络摄像头”作为依赖关系
angular . module ( 'myapp' , [ 'webcam' ] ) ; 然后在html中添加新元素
< webcam > webcam > 高级用法
设置自定义占位符图像在加载流时要显示
">
< webcam placeholder =" 'img/ajax-loader.gif' " >
回调
function MyController ( $scope ) {
$scope . onError = function ( err ) { ... } ;
$scope . onStream = function ( stream ) { ... } ;
$scope . onSuccess = function ( ) { ... } ;
} < webcam
on-stream =" onStream(stream) "
on-streaming =" onSuccess() "
on-error =" onError(err) " >
webcam > 设置一个通道绑定数据
function MyController ( $scope ) {
$scope . myChannel = {
// the fields below are all optional
videoHeight : 800 ,
videoWidth : 600 ,
video : null // Will reference the video element on success
} ;
} < webcam
channel =" myChannel " >
webcam >查看更多示例Wiki
贡献
叉子和克隆这个存储库
-
安装依赖项
NPM安装
-
用咕unt构建/测试
咕unt测试
提出拉动请求(仅在通过Travis build时才合并)
或者只是通过创建问题来帮助。
该项目使用的技术
- Angularjs
- 约曼
- getusermedia
- 帆布
- 视频
该代码是根据MIT许可证获得许可的。 @See许可证文件
下载源码
通过命令行克隆项目:
git clone https://github.com/jonashartmann/webcam-directive.git