【技术实现步骤摘要】
本申请涉及网页编辑，尤其涉及一种图形标注方法、系统、计算机设备和可读存储介质。
技术介绍
1、随着科技的不断发展，运用的工具逐渐增多，需要安装的软件也越来越多。现有的图形编辑(例如对图片进行标注)基本都需要下载对应的软件来进行编辑和修改，这样不仅耗时还耗费内存。并且，若用户在另一个计算机上需要编辑(例如对图片进行标注)对应图案时还需要下载对应的软件后，才能编辑。因此，亟需一种更为便利的图形标注方法。
技术实现思路
1、鉴于上述问题，本申请提出一种图形标注方法、系统、计算机设备和可读存储介质。
2、本申请实施例提出一种图形标注方法，包括：
3、将待标注图像注入web端创建的可缩放矢量图形容器中；
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、注入单元，用于将待标注图像注入web端创建的可缩放矢量图形容器中；
32、监听单元，用于当接收到输入的标注开启信息时，监听所述可缩放矢量图形容器的规定区域内的第一鼠标事件；
33、计算单元，用于基于所述第一鼠标事件和所述可缩放矢量图形容器的容器参数，确定第一底框参数；
34、显示单元，用于基于所述第一底框参数在所述待标注图像上显示第一标注底框和对应的标签。
35、本申请的又一实施例提出一种计算机设备，包括存储单元和处理单元，所述存储单元中存储有计算机程序，所述处理单元通过调用所述存储单元中存储的所述计算机程序，执行上述的图形标注方法的步骤。
36、本申请的再一实施例提出一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序适于处理器进行加载，以执行上述的图形标注方法的步骤。
37、本申请的实施例具有以下的有益效果：
38、本申请实施例提出一种图形标注方法，通过将待标注图像注入web端创建的可缩放矢量图形容器中，当接收到输入的标注开启信息时，监听所述可缩放矢量图形容器的规定区域内的第一鼠标事件；再基于所述第一鼠标事件和所述可缩放矢量图形容器的容器参数，确定第一底框参数；最后基于所述第一底框参数在所述待标注图像上显示第一标注底框和对应的标签。本申请基于web端实现，无需要下载对应的绘图软件，只需通过浏览器即可在线绘制，提高在网页编辑的效率。
本文档来自技高网...【技术保护点】
1.一种图形标注方法，其特征在于，包括：
2.根据权利要求1所述的图形标注方法，其特征在于，所述第一鼠标事件包括第一鼠标按下事件和第一鼠标释放事件，所述第一底框参数包括第一坐标、第二坐标、第三坐标和第四坐标；所述基于所述第一鼠标事件和所述可缩放矢量图形容器的容器参数，确定第一底框参数，包括：
3.根据权利要求2所述的图形标注方法，其特征在于，所述基于获取的所述第一鼠标释放事件和所述第一坐标，确定所述第二坐标、所述第三坐标和所述第四坐标，包括：
4.根据权利要求1所述的图形标注方法，其特征在于，所述基于所述第一底框参数在所述待标注图像上显示第一标注底框和对应的标签，包括：
5.根据权利要求1所述的图形标注方法，其特征在于，还包括：
6.根据权利要求5所述的图形标注方法，其特征在于，所述第二鼠标事件包括第二鼠标按下事件和第二鼠标释放事件，所述基于所述第二鼠标事件和所述第一底框参数，确定第二底框参数，包括：
7.根据权利要求6所述的图形标注方法，其特征在于，所述第一底框参数包括若干坐标；所述根据所述点击坐标和所述第
8.一种图形标注系统，其特征在于，包括：
9.一种计算机设备，其特征在于，包括存储单元和处理单元，所述存储单元中存储有计算机程序，所述处理单元通过调用所述存储单元中存储的所述计算机程序，执行如权利要求1至7任一项所述的图形标注方法的步骤。
10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序适于处理器进行加载，以执行如权利要求1至7任一项所述的图形标注方法的步骤。
...【技术特征摘要】
1.一种图形标注方法，其特征在于，包括：
2.根据权利要求1所述的图形标注方法，其特征在于，所述第一鼠标事件包括第一鼠标按下事件和第一鼠标释放事件，所述第一底框参数包括第一坐标、第二坐标、第三坐标和第四坐标；所述基于所述第一鼠标事件和所述可缩放矢量图形容器的容器参数，确定第一底框参数，包括：
3.根据权利要求2所述的图形标注方法，其特征在于，所述基于获取的所述第一鼠标释放事件和所述第一坐标，确定所述第二坐标、所述第三坐标和所述第四坐标，包括：
4.根据权利要求1所述的图形标注方法，其特征在于，所述基于所述第一底框参数在所述待标注图像上显示第一标注底框和对应的标签，包括：
5.根据权利要求1所述的图形标注方法，其特征在于，还包括：
6.根据权利要求5所述的图形标注方法，其...
【专利技术属性】
技术研发人员：黄泽益，熊友军，
申请(专利权)人：深圳市优必行科技有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。