EasyNVR H5无插件直播方案前端构建之:播放界面添加实时云台控制界面
- 发布于:2026-07-25 18:30:42
- 来源:24直播网

问题:
对于实时直播的视频播放,
由于播放页面客观样式要求(一个播放器占据了整个页面),因此很难找出很合理的空间来放置其他功能按钮的位置(比如配合实时的云平台控制界面);
EasyNVR配置中设有ONVIF探测功能;因此需要在视频播放界面添加了云台控制界面来展示出该功能;
为了保持一个良好的用户体验,在保证不影响播放效果和播放界面的前提下,如何合理的添加云台控制界面成为一个问题。
解决:
由于页面整体的样式,在页面其他位置添加云台控制界面势必会影响整体样式美观;
向下启用空间添加云台控制界面,用会影响用户的实时体验;
在播放的播放器页面上添加一个可以手动触发展示云台控制界面的按钮,让云台界面在播放器界面浮动展示出来,云台界面实时操作结束后,可以手动关闭云台控制界面,并且不影响视频的直播。
通过定位确定好云台控制界面展示的位置,并且将云平台控制界面默认隐藏起来;再设置一个可以点击触发的按钮,通过触发按钮对云台控制界面进行展示和隐藏处理;
完成效果:
代码:
对于云台控制功能的实现,可以通过触发云台控制界面对应的功能按钮,调用对应的接口来实现功能;
EasyNVR云台控制中包含了控制摄像头上、下、左、右的转动,停止功能和焦距的调节等功能。
EasyNVR能够通过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera、NVR等具有RTSP协议输出的设备接入到EasyNVR,EasyNVR能够将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web、Android、iOS),并且EasyNVR能够将视频源的直播数据对接到第三方CDN网络,实现互联网级别的直播分发;
详细说明:http://www.easydarwin.org/easynvr/
邮件:support@easydarwin.org
WEB:www.EasyDarwin.org
相关资讯
最新资讯 - | 半场:比利时1-0土耳其,德布劳内破门,卢克巴吉奥送助攻
- | 德拉富恩特:C罗离营?我不了解相关信息,无法评价
- | 波特调侃曼城案:我们球队的缺席人数快赶上他们的违规数量了
- | 英国议员就曼城案致信监管机构:要求调查为何9年间未发现异常
- | 索里亚诺回应3分半不眨眼视频:没有使用AI,完全是我本人
- | 太阳报:曼城裁决前11天穆巴拉克曾赴与英国商务大臣秘密会面
- | 苏比门迪:我们都想成为主角,但排在我前面的是世界最佳后腰
- | 泰晤士:曼城被调查后商业收入增速放缓,落后利物浦和阿森纳
- | 比利时vs土耳其:德布劳内、蒂勒曼斯首发,居莱尔出战
- | TA盘点曼城违规9年期间的42名重点引援:丁丁、B席等人领衔
