# HODVIS **Repository Path**: ma-shituo/hodvis ## Basic Information - **Project Name**: HODVIS - **Description**: 软件工程之目标检测可视化系统 - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 1 - **Created**: 2021-12-31 - **Last Updated**: 2024-06-21 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # NABCD 模型分析 ## N（Need） > 目标检测的可视化系统 > > 团队：马世拓，安禹，刘颖，朱勇 目标检测在实际场景例如行人检测、物品检测以及车辆自动驾驶等领域有着重要应用，但嵌入内核算法的可视化系统开发使得它真正能够作为一种成型产品流通，所以可以根据前端开发与AI开发方法结合制作目标检测的可视化系统。 ## A（Approach） - 支持图像目标检测 - 支持视频目标检测 - 可以进行高精度检测 - 可以可视化模型相关指标 - 可以切换不同模型架构 ## B（Benefit） - 精度高 - 检测种类多 - 可视化系统与用户交互 - 能切换不同方法检测 ## C（Competitors） 现有可视化系统软件的不足: - 前端编写不够美观 - 模型训练复杂，需要大规模数据集 - 多种语言协作，需要良好配合 ## D（Delivery） - 增加更多模型架构选择 - 增加更多前端动效 # 原型设计 原型设计链接 --- https://modao.cc/app/406d89a8807dec26d82bab673aa6cd0fee502cd4 ### 主页 可选择算法类型，输入导出文件的路径，选择图片检测还是视频检测 ![主页](https://images.gitee.com/uploads/images/2021/1119/190713_4df78a84_6580830.png "首页_默认状态.png") 图片检测 --- ### 输入目标图片界面 可输入导入图片的路径 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1119/191702_ecae4c0b_6580830.png "图像识别_默认状态.png") ### 图片检测结果界面 输出检测后的图片，图片中有物体的标签；同时显示记录标签的文本 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1119/191938_5e139406_6580830.png "图像识别结果.png") 视频检测 --- ### 输入目标视频界面 可输入导入视频的路径，可播放导入的视频 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1119/192209_66a0612f_6580830.png "视频识别_默认状态.png") ### 视频检测结果界面 输出检测后的视频（可播放），视频中有物体的标签；同时显示记录标签的文本 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1119/192334_b387e4a3_6580830.png "视频识别结果.png") 帮助和关于 --- 介绍系统功能、实现方式、使用方法、系统制作人员等 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1119/192517_a1f91199_6580830.png "帮助和关于_默认状态.png") # UML图 ### 用例图 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/094909_56e8bccf_6580830.png "用例图.PNG") ### 类图 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/094930_0fb56332_6580830.png "类图.PNG") ### 状态图 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/095408_30a431e1_6580830.png "状态图.PNG") ### 活动图 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/095435_db066973_6580830.png "活动图.PNG") # 系统结构 ### 前端网页 前端网页负责读取用户输入的图片、视频，并调用识别程序输出目标检测结果。主要由主页和详情页两个部分组成，其中主页有图片检测和视频检测两大模块。 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/095805_31f1a632_6580830.png "屏幕截图.png") ### 目标检测后端 使用python代码编写后端代码，调用opencv库实现了Faster RCNN算法。主要包括视频检测功能实现模块与图像检测功能实现模块。 其中Faster RCNN由以下部分组成： 1.数据集，image/video input 2.卷积层CNN等基础网络，提取特征得到feature map 3-1.RPN层，再在经过卷积层提取到的feature map上用slide window遍历整个feature map,在遍历过程中每个window中心按rate，scale参数生成anchors，然后再利用全连接对每个anchors做二分类和初步bbox regression，最后输出比较精确的ROIs。 3-2.把经过卷积层feature map用ROI pooling固定全连接层的输入维度。 4.然后把经过RPN输出的rois映射到ROIpooling的feature map上进行bbox回归和分类。 # 关键数据结构定义 ### 需要处理的数据 前端部分需要处理用户选择的路径，并从中识别文件地址，传输图片、视频到后端中 定义了一个方法onImageAccessed，用来处理关键数据，包括图片URL、图片名称、以及调用后端对应接口 function onImageAccessed(inputFile) { var imageLinkUrl = getObjectURL(inputFile.files[0]); var rawImageShowColumn = document.getElementById('rawImage'); var resultImageShowColumn = document.getElementById('imageResult'); var fileName = inputFile.files[0].name; var exeUrl = 'pythonw dir'+ fileName; rawImageShowColumn.setAttribute('src', imageLinkUrl); exec1(exeUrl); resultImageShowColumn.src = ''; }; 后端部分主要是把视频分解为图片，并采用Faster RCNN网络实现目标的识别 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/100054_0544d245_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/100107_218101ed_6580830.png "屏幕截图.png") 一个保存了所有类名的存储结构提供了输出结果的实现。 # 关键算法设计 对于目标检测的算法，目前学界主要将其分为one-stage和two-stages两类端到端的检测方法。而两类方法分别以YOLO v5和Faster RCNN为代表，本项目实现了两种不同的目标检测模式，并均取得了较好的效果。 ### Faster-RCNN 经过R-CNN和Fast RCNN的积淀，Ross B. Girshick在2016年提出了新的Faster RCNN，在结构上，Faster RCNN已经将特征抽取(feature extraction)，proposal提取，bounding box regression(rect refine)，classification都整合在了一个网络中，使得综合性能有较大提高，在检测速度方面尤为明显。 Faster R-CNN的训练，是在已经训练好的model的基础上继续进行训练。实际中训练过程分为6个步骤： 1.在已经训练好的model上，训练RPN网络。 2.利用步骤1中训练好的RPN网络，收集proposals。 3.第一次训练Fast RCNN网络。 4.第二训练RPN网络。 5.再次利用步骤4中训练好的RPN网络，收集proposals。 6.第二次训练Fast RCNN网络。 可以看到训练过程类似于一种“迭代”的过程，不过只循环了2次。因为循环更多次也不会有更多提升。 ### YOLO YOLO 的核心思想就是把目标检测转变成一个回归问题，利用整张图作为网络的输入，仅仅经过一个神经网络，得到bounding box（边界框） 的位置及其所属的类别。 现在看来，YOLOv1的网路结构非常明晰，是一种传统的one-stage的卷积神经网络： 网络输入：448×448×3的彩色图片。 中间层：由若干卷积层和最大池化层组成，用于提取图片的抽象特征。 全连接层：由两个全连接层组成，用来预测目标的位置和类别概率值。 网络输出：7×7×30的预测结果。 YOLOv1采用的是“分而治之”的策略，将一张图片平均分成7×7个网格，每个网格分别负责预测中心点落在该网格内的目标。回忆一下，在Faster R-CNN中，是通过一个RPN来获得目标的感兴趣区域，这种方法精度高，但是需要额外再训练一个RPN网络，这无疑增加了训练的负担。在YOLOv1中，通过划分得到了7×7个网格，这49个网格就相当于是目标的感兴趣区域。通过这种方式，我们就不需要再额外设计一个RPN网络，这正是YOLOv1作为单阶段网络的简单快捷之处！ # 数据管理说明 整个系统访问数据主要有三部分，一部分是前端页面通过按钮访问后端检测代码、模型，一部分是输出文件读取，还有一部分是用户的输入文件。 用户可选择视频输入和图像输入两种模式，通过点击预测按钮，前端页面将调用信息反馈到后端，检测部分代码使用预训练模型生成的权重进行检测，得到结果再反馈给前端，页面刷新以后可以读取结果。 # 实现环境与代码管理 软件开发的硬件环境为Windows 10操作系统和intel i7型号CPU，16G内存，显卡GTX 1650。所使用软件为：后端目标检测代码在Pycharm上编写，技术框架为Python+OpenCV，前端代码在VSCode上编写，应用HTML+CSS+JavaScript。 代码分两部分编写，马世拓同学负责Python的目标检测后端，其他三位同学负责前端。模型使用开源的Faster-RCNN和YOLO代码与预训练权重，在COCO数据集上进行再训练得到更新权重。 # 关键函数说明 ### 后端部分 对于图像处理，可以切换YOLO和Faster-RCNN两种模式。COCO数据集一共能够检测80种不同的目标，所以这两个网络在通用场景下的识别能力是很强的。 对于Faster-RCNN，类中定义了get_coco_names、get_faster_rcnn_model、get_outputs_names、postprocess、predict、vis_res等函数。其中，get_coco_names和get_faster_rcnn_model是读取类别和读取模型文件的过程，构建起预测框架；get_outputs_names是输出网络结构，postprocess是预处理函数，目的是为了过滤掉低confidence的proposal并将候选框传给预测函数。predict进行预测，输出每个候选框的结果，最后vis_res函数将结果按照阈值进行筛选并综合，将目标框和对应标签写入原图像并输出结果图像和运行时间。 对于YOLO，其基本思想一致。这里并未采用面向对象或者多函数编程，直接读取模型文件和载入图片，获取候选框，得到每个框的置信度、类别和相应概率，按照一定阈值进行筛选过滤并写入图像。 对于视频预测，这里只实现了Faster-RCNN的检测。从图像到视频我们仅需更改vis_res函数，将视频流抽象为多帧图像，然后对每帧图像进行一次目标检测以后重新还原为视频即可。这里我们选用了高速公路上的街景视频。 ### 前端部分 包括图片获取与处理、视频获取与处理、图片刷新和视频刷新四个功能。图片获取与处理和视频获取与处理两个函数结构类似，输入文件，并调用对应的网络进行检测，生成结果保存。而两个刷新功能则是将对应结果刷新在网页中输出显示。 # 测试计划与测试用例 测试分图片和视频两部分测试进行。页面展示如图： ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/100958_eaa9c6ac_6580830.png "屏幕截图.png") ### 图像检测结果 首先测试图像，测试的五张用例如图所示： ![](https://images.gitee.com/uploads/images/2021/1231/101028_5b3ee107_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101039_5b9981dd_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101046_d529a77a_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101053_3458f0b2_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101101_5b4c8c09_6580830.png "屏幕截图.png") 经过YOLO检测的五个输出分别为： ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101114_07f44d56_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101124_8a6467b3_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101133_e5d4913f_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101141_d8de8a67_6580830.png "屏幕截图.png") 证明YOLO确实能够正确工作。 而经过Faster-RCNN的五个输出分别为： ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101204_0f26e9ee_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101212_2da1b7fe_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101218_1c0e9666_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101225_3b9227be_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101234_bd2429b0_6580830.png "屏幕截图.png") 证明两者都能成功进行目标检测。事实上，目标检测时间是YOLO慢于Faster-RCNN的。所以视频使用Faster-RCNN检测。 ### 视频检测结果： 原始视频采用街景下的高速公路上车辆行驶，目标检测车辆。 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101245_ba91e279_6580830.png "屏幕截图.png") 测试结果如下： ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101253_bcab6f6e_6580830.png "屏幕截图.png") ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101300_8e2eff46_6580830.png "屏幕截图.png") 说明在视频流场景下确实能够进行良好的交互。 # 结果分析 测试结果表明我们的目标检测具备较高性能，能够迅速检测多种物体，并且在自然场景下鉴别结果较好，能够对视频和图像均进行目标检测处理，后端性能满足要求。而前端部分设计满足基本需求，能够调用后端，前后端数据能够流通，软件基本实现需求。 #用户反馈 用户打开html文件，主页可选择图片检测和视频检测两种功能。该系统目前支持使用faster-rcnn算法和yolo（更改html内核）进行目标检测。在图片检测功能中可以从本地文件中选择要检测的图片。 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101359_5227fd5a_6580830.png "屏幕截图.png") 选择好图片后，点击获取结果，输出检测后的图片结果，图片结果中包括检测出的物体和标签。 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/103314_b77c5285_6580830.jpeg "QQ图片20211231102938.jpg") 选择视频检测功能，选择好本地视频，点击获取结果，输出检测后的视频结果，视频结果中包括检测出的物体和标签。网页可播放视频。 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101447_c2a559b2_6580830.png "屏幕截图.png") 点击网页右上角的“关于”，显示出系统的介绍，包括系统目标和开发小组每个成员的分工。 ![输入图片说明](https://images.gitee.com/uploads/images/2021/1231/101504_e5b4bfce_6580830.png "屏幕截图.png") 用户使用后反馈到，系统实现了大部分需求目标。系统可以较准确地实现图片或视频中的物体检测并识别出物体种类，可识别的物体种类较多；系统的网页前端界面基本清楚地展示了系统的功能。不足在于部分需求还未达到，系统的网页前端界面还不够美观，系统目前只能作为本地文件使用。