随笔 - 936  文章 - 0  评论 - 3  阅读 - 30万

EasyGBS视频通道定位时在电子地图双击视频导致地图放大问题优化

几个月前,我们在EasyGBS内开发了实时定位播放视频通道的功能,也就是说目前EasyGBS已经实现了地图定位,我们主要是通过循环渲染< bm-info-window >< /bm-info-window >标签来实现该功能的。

在测试期间,EasyGBS开启电子地图后,双击视频地图会放大,用户的误触可能对视频的观测造成影响。分析可能是事件冒泡导致的,但是我们给父级元素阻止事件冒泡,发现解决不了。

查看相关文档,可能是自定义覆盖物会触发,修改代码如下:

 <bm-info-window :position="markerPoint">
          <VideoDlg
           v-show="isVideoShow"
            :position="markerPoint">
            <template>
              <div class="player-map">
                <div class="player-map-title">
                  通道Channel1
                  <i class="iconfont iconclose1" @click="isVideoShow = false"></i>
                </div>
                <EasyPlayer
                  :videoUrl="videoUrl"
                  alt=""
                  :poster="snapUrl"
                  :loading="bLoading"
                  @update:loading="onLoading"
                  @message="onMessage"
                  :muted="muted"
                  stretch
                  :live="true"
                ></EasyPlayer>
              </div>
            </template>
          </VideoDlg>
        </bm-info-window>

使用信息窗体覆盖物加载快照时正常显示,但是播放视频不能正常播放:

因此我们最后决定禁用地图双击事件,避免此类问题的发生。

:double-click-zoom="false"

修改后视频正常播放:

EasyGBS视频智能分析平台在交通、安防等场景下具备很好的适应性,而今年TSINGSEE青犀视频研发团队刚推出的国标推流平台EasyGBD让国标协议的视频推流变得更加便捷,关于EasyGBS和EasyGBD的使用,欢迎大家了解及测试。

posted on   EasyGBS  阅读(53)  评论(0编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 提示词工程——AI应用必不可少的技术
· 字符编码:从基础到乱码解决
· 地球OL攻略 —— 某应届生求职总结
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

点击右上角即可分享
微信分享提示