一种基于SVG共享画板的擦除方法、终端及存储介质技术

技术编号:36794121 阅读:30 留言:0更新日期:2023-03-08 22:54
本申请公开一种基于SVG共享画板的擦除方法、终端及存储介质,属于显示屏调节技术领域。该擦除方法包括以下步骤:以当前SVG共享画布中鼠标落点为中心,绘制预设尺寸的矩形橡皮擦;遍历SVG共享画布上所有画笔对象,以找出目标画笔对象,目标画笔对象为对应路径所构成的最小矩形与矩形橡皮擦相交的画笔对象;遍历目标画笔对象的对应路径,以确认目标画笔对象与矩形橡皮擦的相交情形;根据目标画笔对象与矩形橡皮擦的相交情形,对目标画笔对象进行第一删除操作或第二删除操作。本技术方案,其可在SVG共享画板上,不受画板中线条结构的约束,实现对画笔对象任意精确性的擦除效果。现对画笔对象任意精确性的擦除效果。现对画笔对象任意精确性的擦除效果。

【技术实现步骤摘要】
一种基于SVG共享画板的擦除方法、终端及存储介质


[0001]本申请涉及浏览器
,特别涉及一种基于SVG共享画板的擦除方法、终端及存储介质。

技术介绍

[0002]近年来,随着各个行业由线下办公纷纷走向了线上办公,视频会议、在线协同办公等场景也随之出现,特别是共享画板机制在视频会议当中展现出尤为突出的作用,而成为了备受关注的焦点。现有的常用技术无非是Canvas(Canvas是在HTML5中新增的元素标签,用于在网页上绘制图像(位图),相当于在HTML中嵌入了一张画布,Canvas本身不具备绘图能力,但可借助JavaScript来实现绘图功能)和SVG(Scalable Vector Graphics,意为可缩放的矢量图形,是一种开放标准的矢量图形语言,可设计出高分辨率的Web图形页面,用户可以直接用代码来描绘图像,通过改变部分代码来使图像具有交互功能,并可以随时插入到HTML中通过浏览器来观看)两种方案实现共享画板,但Canvas是基于标量的位图,一旦图形形成,就不能操作其内部的对象属性,若要改变其结构只能重新绘制渲染,而SVG形成的线本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于SVG共享画板的擦除方法,其特征在于,所述擦除方法包括以下步骤:以当前SVG共享画布中鼠标落点为中心,绘制预设尺寸的矩形橡皮擦;遍历所述SVG共享画布上所有画笔对象,以找出目标画笔对象,所述目标画笔对象为对应路径所构成的最小矩形与所述矩形橡皮擦相交的画笔对象;遍历所述目标画笔对象的对应路径,以确定所述目标画笔对象与所述矩形橡皮擦的相交情形;根据所述目标画笔对象与所述矩形橡皮擦的相交情形,对所述目标画笔对象进行第一删除操作或第二删除操作,所述第一删除操作为将所述目标画笔对象整体删除的操作,所述第二删除操作为将所述目标画笔对象的相应部分删除以及对所述目标画笔对象的剩余部分进行重绘的操作。2.根据权利要求1所述的擦除方法,其特征在于,所述擦除方法还包括以下步骤:在浏览器中应用SVG标签绘制预设大小的画布,以生成所述SVG共享画布,并建立所述SVG共享画布的画布坐标与鼠标实际移动坐标的一一对应关系。3.根据权利要求1所述的擦除方法,其特征在于,所述擦除方法还包括以下步骤:在每一所述画笔对象绘制时,对当前所述画笔对象的对应路径进行循环遍历,以获取并存储所述对应路径上所有点的点坐标;进一步获取所述对应路径所构成的最小矩形,以计算并存储所述最小矩形的四个第一角坐标。4.根据权利要求3所述的擦除方法,其特征在于,所述以当前SVG共享画布中鼠标落点为中心,绘制预设尺寸的矩形橡皮擦的步骤具体包括:以当前SVG共享画布中鼠标落点为中心,进行所述预设尺寸的矩形橡皮擦的绘制,并记录所述矩形橡皮擦的四个第二角坐标。5.根据权利要求4所述的擦除方法,其特征在于,所述遍历所述SVG共享画布上所有画笔对象,以找出目标画笔对象的步骤具体包括:依次获取所述SVG共享画布上每一所述画笔对象对应的所述四个第一角坐标;若所述四个第一角坐标所围成的矩形与所述矩形橡皮擦的四个第二角坐标所围成的...

【专利技术属性】
技术研发人员:刘楠楠
申请(专利权)人:深圳市洲明科技股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1