海康威视WEB视频监控插件3.3 解决视频画面遮挡无法隐藏的问题

原创于 2025-05-20 10:39:09 发布 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #开发语言 #海康

海康监控网页视频插件3.3 好像没有隐藏画面的接口了,这几天捣鼓了一下,要做弹窗的第二屏页面,如果一直停止播放,再重新播放的话,感觉效率很低,就没试,选择其他野路子,比如把画面移到屏幕外面或者把窗口大小改成一丢丢大

在官方的接口里面找到了修改画面大小的接口,试一下之后发现可行,不过还是需要一些特殊操作触发的,不然可能一时间不生效,需要手动触发窗口大小变化

上代码:

vue3,子组件里面,封装两个函数就行了, 如果没有 window.dispatchEvent(new Event("resize"));这句话,我这边监控画面会不出来,所以要加上,各位自行测试吧

const hideHKCamera = async () => {
  await WebVideoCtrl.I_Resize(1, 1);
};

const showHKCamera = async () => {
  await WebVideoCtrl.I_Resize(props.divWidth, props.divHeight);
  window.dispatchEvent(new Event("resize"));
};

defineExpose({
  hideHKCamera,
  showHKCamera,
});

各位大佬如果有更加优雅的方案,请评论告诉我