一种应用于网页的矢量图形的操作方法和装置制造方法及图纸

技术编号:9238368 阅读:122 留言:0更新日期:2013-10-10 02:26
本发明专利技术提供了一种应用于网页的矢量图形的操作方法,该方法包括以下步骤:响应用户对网页画板中画笔工具或擦除工具的操作,触发绘制或擦除状态;当触发绘制状态时,基于flash技术获取画笔工具的操作位置,记录画笔工具的绘制轨迹并绘制矢量图形;当触发擦除状态时,以位图的形式缓存已绘制的图形,基于flash技术获取擦除工具的操作位置,记录擦除工具的擦除轨迹并擦除位图图形。相应地,还提供了一种应用于网页的矢量图形的操作装置。本发明专利技术提供的图形操作方法和装置可以有效地实现矢量图形的绘制和像素级别的擦除,提升了用户的图形操作体验。

【技术实现步骤摘要】
一种应用于网页的矢量图形的操作方法和装置
本专利技术涉及图形操作技术,尤其涉及一种应用于网页的矢量图形的操作方法和装置。
技术介绍
现有技术中,操作图形时虽然采用矢量图形的绘制方法,绘制过程中保存每一笔画的位置和形状,但是对图形进行擦除操作时只能针对每一笔画进行擦除,如广泛应用于电脑(pc)桌面的幻灯片(powerpoint,简称ppt)画笔工具,在ppt处于放映状态时,可以通过指针选项选择不同的画笔工具进行各种标注,并通过选择“橡皮擦”工具擦除这些标注。但是由于现有方案仅支持笔画级别的擦除,不支持像素级别的擦除,导致以下问题的出现:第一,擦除操作的效率低,例如ppt上的擦除方式是:使用画笔工具进行重点内容的一次标注后,通过点击“橡皮擦”,一次性擦除所述标注轨迹,不能实现按需按量擦除,容易引起误操作,用户可能还需要进行再次标注;第二,橡皮擦效果不够真实。此外,虽然操作系统(例如,windows)提供的画图工具可以实现对图形的像素级别的擦除,但是该工具仅仅是通过pc编程技术应用在pc本地上,而不能基于flash技术应用于网络,由此,该画图工具针对的服务对象仅仅是桌面用户,对于使用浏览器上网的互联网用户却无能为力。因此,希望可以提出一种用于解决上述问题的应用于网页的矢量图形的操作方法和装置。
技术实现思路
本专利技术的目的是提供一种应用于网页的矢量图形的操作方法和装置,可以实现对网页上的矢量图形进行有效操作。需要说明的是,本文所述的flash技术主要是指矢量动画技术,用于设计和编辑动画。根据本专利技术的一个方面,提供了一种应用于网页的矢量图形的操作方法,该方法包括以下步骤:响应用户对网页画板中画笔工具或擦除工具的操作,触发绘制或擦除状态;当触发绘制状态时,基于flash技术获取画笔工具的操作位置,记录画笔工具的绘制轨迹并绘制矢量图形;当触发擦除状态时,以位图的形式缓存已绘制的图形,基于flash技术获取擦除工具的操作位置,记录擦除工具的擦除轨迹并擦除位图图形。根据本专利技术的另一个方面,还提供了一种应用于网页的矢量图形的操作装置,包括:状态触发单元,用于响应用户对网页画板中画笔工具或擦除工具的操作,触发绘制或擦除状态;绘制单元,基于flash技术获取画笔工具的操作位置,记录画笔工具的绘制轨迹并绘制矢量图形;擦除单元,以位图的形式缓存已绘制的图形,基于flash技术获取擦除工具的操作位置,记录擦除工具的擦除轨迹并擦除位图图形。与现有技术相比,本专利技术具有以下优点:本专利技术相对于现有技术的图形操作技术,提高了操作效果,尤其在图像擦除方面实现了像素级别的擦除,提升了擦除的效果,更好地满足用户的需求。附图说明通过阅读参照以下附图所作的对非限制性实施例所作的详细描述,本专利技术的其它特征、目的和优点将会变得更明显:图1为根据现有技术的ppt画笔工具进行绘制的页面示意图;图2为根据现有技术的ppt画笔工具进行擦除的页面示意图;图3为根据本专利技术一个优选实施例的应用于网页的矢量图形的操作方法流程图;图4为根据本专利技术一个优选实施例的应用于网页的画笔工具进行绘制的页面示意图;图5为根据本专利技术一个优选实施例的应用于网页的画笔工具进行擦除的页面示意图;图6为根据本专利技术另一个优选实施例的应用于网页的矢量图形的操作装置的示意性框图。具体实施方式下面结合附图对本专利技术作进一步详细描述。根据本专利技术的一个方面,提供了一种应用于网页的矢量图形的操作方法。请参考图3,图3为根据本专利技术一个优选实施例的应用于网页的矢量图形的操作方法流程图。如图3所示,本专利技术所提供的应用于网页的矢量图形的操作方法包括以下步骤:步骤S301,响应用户对网页画板中画笔工具或擦除工具的操作,触发绘制或擦除状态。具体地,用户通过诸如鼠标、触屏设备、触屏手等在网页画板中选取各种图形操作工具,包括画笔工具、图形擦除工具(典型地如橡皮)。选取完毕后,即可以应用该图形操作工具进行图形的各种操作,如通过鼠标点击画笔工具后即可在画板中绘制图形,又如通过鼠标点击橡皮工具即可在画板中擦除已绘制的图形。步骤S302,当触发绘制状态时,基于flash技术获取画笔工具的操作位置,记录画笔工具的绘制轨迹并绘制矢量图形。具体地,当绘制状态触发后,通过诸如鼠标、触屏设备、触屏手等选取画笔工具,并通过程序读取所述画笔工具在网页画板的操作位置。以鼠标选取画笔工具为例,首先建立flash项目文档类,将全局对象stage(画笔所作用的舞台)单例化,以便可以在flash程序的任意模块获取属性值stage.MouseX(鼠标的横坐标)和stage.MouseY(鼠标的纵坐标),从而获得所述以画笔工具样式显示的实际鼠标相对与舞台原点所按下的位置(或全局坐标)。其中,所述flash项目文档类是flash技术中所引进的类,这个类的作用是管理flash文档;所述将全局对象单例化是指该对象只能创建其子类的唯一对象。所述MouseX属性和MouseY属性来自flash全局坐标的DisplayObject类,通常用于表示鼠标坐标,具体表示鼠标偏移坐标系原点的偏移量。进一步地,加入逐帧判断函数记录鼠标绘制轨迹。其中,所述逐帧判断函数主要用于刷新鼠标位置,用户在绘制或擦除过程中需要记录鼠标当前位置。通过定义私有变量positionX、positionY,在动画播放的每一帧记录鼠标位置,并在每一帧的末段将stage.MouseX、stage.MouseY分别赋值给二者。其中,所述每一帧实现步骤的伪代码可参照如下内容:接下来,调用flash矢量绘制类shape的绘制线段(lineTo)方法进行矢量图形绘制。记录轨迹的同时在鼠标位置处绘制线条。其中,所述矢量绘制类Shape主要用于绘制矢量图形,lineTo方法用来绘制线段,通过传入当前需绘制位置参数完成绘制,由于绘制过程在动画播放的每一帧都进行刷新故每帧绘制的线条片段较为细致。可参考图4,图4为根据本专利技术一个优选实施例的应用于网页的画笔工具进行绘制的页面示意图,如图4所示,应用矢量绘制类shape的lineTo方法绘制了图中的线条部分(图4中以红色线条标注)。以鼠标选取画笔工具为例,按照以上方法绘制矢量线条图形时,默认情况下用户的一个绘制行为包括:按下鼠标---绘制图像---抬起鼠标三个过程。一个绘制行为触发之后会立刻将用户所绘制的图形缓存成为位图。如果用户有多次绘制行为,则缓存成多张位图。步骤S303,当触发擦除状态时,以位图的形式缓存已绘制的图形,基于flash技术获取擦除工具的操作位置,记录擦除工具的擦除轨迹并擦除位图图形。具体地,当触发的状态由绘制切换到擦除时,将所记录的多张位图数据合并,生成一张完整的图像。接下来,与前述的绘制状态类似,通过诸如鼠标、触屏设备、触屏手等选取擦除工具,并通过程序读取所述擦除工具在网页画板的操作位置。同样,以鼠标为例,基于flash程序获取属性stage.MouseX和stage.MouseY,从而获得所述以擦除工具样式显示的实际鼠标相对与舞台原点所按下的位置(或全局坐标),以精确确定以位图形式缓存的图形的像素级擦除位置。可参考图5,图5为根据本专利技术一个优选实施例的应用于网页的画笔工具进行擦除的页面示意图。图5示出了以像素级别擦除原有绘制标注的过程(图5中以红色本文档来自技高网...
一种应用于网页的矢量图形的操作方法和装置

【技术保护点】
一种应用于网页的矢量图形的操作方法,该方法包括:响应用户对网页画板中画笔工具或擦除工具的操作,触发绘制或擦除状态;当触发绘制状态时,基于flash技术获取画笔工具的操作位置,记录画笔工具的绘制轨迹并绘制矢量图形;当触发擦除状态时,以位图的形式缓存已绘制的图形,基于flash技术获取擦除工具的操作位置,记录擦除工具的擦除轨迹并擦除位图图形。

【技术特征摘要】
1.一种应用于网页的矢量图形的操作方法,该方法包括:响应用户对网页画板中画笔工具或擦除工具的操作,触发绘制或擦除状态;当触发绘制状态时,基于flash技术获取画笔工具的操作位置,记录画笔工具的绘制轨迹并绘制矢量图形;当触发擦除状态时,以位图的形式缓存已绘制的图形,基于flash技术获取擦除工具的操作位置,记录擦除工具的擦除轨迹并擦除位图图形。2.根据权利要求1所述的操作方法,其特征在于,所述画笔工具或擦除工具通过鼠标、触屏设备或触屏手选取。3.根据权利要求2所述的操作方法,其特征在于,所述画笔工具由鼠标选取后,建立flash项目文档类,将全局对象stage单例化,通过flash程序获取属性值stage.MouseX和stage.MouseY以获得所述画笔工具在画板的相对位置。4.根据权利要求1或3所述的操作方法,其特征在于,调用flash矢量绘制类shape的lineTo方法绘制矢量图形。5.根据权利要求1或3所述的操作方法,其特征在于,通过加入逐帧判断函数记录所述画笔工具或擦除工具的操作轨迹。6.根据权利要求1至3任意一项所述的操作方法,其特征在于,所述方法应用于网页ppt播放器中。7.一种应用于网页的矢量图形...

【专利技术属性】
技术研发人员:李衡张东宁刘洪敏
申请(专利权)人:百度在线网络技术北京有限公司
类型:发明
国别省市:

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

1