angular本周周报

我永远喜欢悉达凯隐

于 2022-05-05 23:19:47 发布

阅读量266

点赞数

文章标签： angular

本文链接：https://blog.csdn.net/KaynSweety/article/details/124586561

版权

本周在Angular项目中，完成了视频监控界面的开发，包括路由传递、监控范围和视频墙选择。遇到HTML video标签显示问题，通过学习解决。地图展示事件方面，实现了关键字检索并显示事件点，但需解决如何结合检索信息同步显示事件框。此外，报警界面的制作正在进行。

摘要由CSDN通过智能技术生成

一、视频监控界面

1.搞好路由传送后到视频监控界面
在这里插入图片描述

2.上面可以选择监控范围，下面选择视频墙分布
在这里插入图片描述

3.在做视频展示时遇到问题，使用html语法直接用vedio标签无法显示视频，就会出现下面这样的情况。

参考其他同学上传视频的代码，成功展示视频

但是这个是要先上传本地视频才能播放。

二、地图展示事件

这周成功研究了怎么使用baidumap展示事件，但是还有很多不妥当的地方
首先是通过检索关键字信息，可以检索到北京市和“桥”相关的事件点展示在地图上
在这里插入图片描述

var map = new BMapGL.Map("container");            // 创建Map实例
	map.centerAndZoom(new BMapGL.Point(116.274625,39.961627), 11);
	map.enableScrollWheelZoom();                            //启用滚轮放大缩小

	var local = new BMapGL.LocalSearch(map, {
		renderOptions:{map: map}
	});
	var pStart = new BMapGL.Point(116.274625,39.961627);
	var pEnd = new BMapGL.Point(116.367474,39.988609);
	var bs = new BMapGL.Bounds(pStart,pEnd);   //自己规定范围
	local.searchInBounds("桥", bs);

	var polygon = new BMapGL.Polygon([
		new BMapGL.Point(pStart.lng,pStart.lat),
		new BMapGL.Point(pEnd.lng,pStart.lat),
		new BMapGL.Point(pEnd.lng,pEnd.lat),
		new BMapGL.Point(pStart.lng,pEnd.lat)
		], {strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5});
	map.addOverlay(polygon);