CN109658485B - 网页动画绘制方法、装置、计算机设备和存储介质 - Google Patents
网页动画绘制方法、装置、计算机设备和存储介质 Download PDFInfo
- Publication number
- CN109658485B CN109658485B CN201811388998.1A CN201811388998A CN109658485B CN 109658485 B CN109658485 B CN 109658485B CN 201811388998 A CN201811388998 A CN 201811388998A CN 109658485 B CN109658485 B CN 109658485B
- Authority
- CN
- China
- Prior art keywords
- animation
- image
- parameters
- original
- parameter
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 39
- 238000003860 storage Methods 0.000 title claims abstract description 13
- 238000009877 rendering Methods 0.000 claims abstract description 31
- 238000010606 normalization Methods 0.000 claims abstract description 20
- 238000012545 processing Methods 0.000 claims abstract description 18
- 239000000463 material Substances 0.000 claims abstract description 14
- 230000006870 function Effects 0.000 claims description 69
- 239000011159 matrix material Substances 0.000 claims description 34
- 239000012634 fragment Substances 0.000 claims description 8
- 230000006978 adaptation Effects 0.000 claims description 6
- 238000004806 packaging method and process Methods 0.000 claims description 5
- 238000012163 sequencing technique Methods 0.000 claims 1
- 238000013461 design Methods 0.000 abstract description 7
- 238000005516 engineering process Methods 0.000 abstract description 3
- 238000012986 modification Methods 0.000 abstract description 2
- 230000004048 modification Effects 0.000 abstract description 2
- 230000008569 process Effects 0.000 description 8
- 230000000694 effects Effects 0.000 description 6
- 238000010586 diagram Methods 0.000 description 5
- 238000005457 optimization Methods 0.000 description 4
- 230000008901 benefit Effects 0.000 description 3
- 238000012549 training Methods 0.000 description 3
- 238000012937 correction Methods 0.000 description 2
- 241000533950 Leucojum Species 0.000 description 1
- 230000009471 action Effects 0.000 description 1
- 238000004458 analytical method Methods 0.000 description 1
- 238000004364 calculation method Methods 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 238000012938 design process Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000003631 expected effect Effects 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 230000007246 mechanism Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000003068 static effect Effects 0.000 description 1
- 230000007704 transition Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
- G06T13/80—2D [Two Dimensional] animation, e.g. using sprites
Landscapes
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Processing Or Creating Images (AREA)
Abstract
本申请涉及页面设计技术领域,尤其涉及一种网页动画绘制方法、装置、计算机设备和存储介质。所述方法包括:获取动画图像参数,动画图像参数包括图像样式参数和图像属性参数;根据图像样式参数,从预设的图像样本集中抽取图像素材,形成原始动画组,归一化处理得到归一化动画组;获取预设的动态播放参数,将预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据动画运动参数,设置归一化动画组中各个图像停留时间后形成原始动画样本;获取原始动画样本中的关键帧,根据关键帧的特征属性,渲染原始动画样本中的所有图像,形成最终动画。本申请通过对动画绘制方式的改进,实现对网页动画的自定义及时修改。
Description
技术领域
本申请涉及页面设计技术领域,尤其涉及一种网页动画绘制方法、装置、计算机设备和存储介质。
背景技术
随着计算机和网络技术的发展,通过网页获取信息成为人们生活的一部分。在网页浏览过程中,经常会包含动画效果,如通过服务器请求数据时,可能会有等待数据的过程,呈现等待的动画效果,表示等待过程。
在根据用户的需求进行动画绘制时,往往需要对用户需要的动画进行gif图片制作后,然后再进行播放,用户根据播放的效果与预期效果的差异提出改进点后,在对已经制作好的动画内容进行修正,耗费大量的时间,并且不能及时满足用户自定义动画中各个画面播放间隔,无法达到用户自定义绘制动画的需求。
发明内容
有鉴于此,有必要针对目前网页动画绘制时,不能根据用户需求及时对动画内容进行及时有效绘制的问题,提供一种网页动画绘制方法、装置、计算机设备和存储介质。
一种网页动画绘制方法,包括如下步骤:
获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;
根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组;
获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;
获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画。
在其中一个实施例中,所述获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数,包括:
获取第一动画图像参数,所述第一动画图像参数包括图像样式参数;
根据动画播放组件的参数,判断所述第一动画图像参数是否满足动画组件参数条件;
若满足,则将所述第一动画参数作为所述动画图像参数;
若不满足,则获取所述图像样式参数对应的默认图像属性参数,根据所述默认图像属性参数生成满足动画组件播放参数条件的动画图像参数。
在其中一个实施例中,所述根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组,包括:
获取新增动画请求信息,抽取出所述新增动画请求信息中所包含的图像样式参数和图像属性参数;
根据图像样式参数查询所述预设的图像样本集,抽取与所述图像样式参数的差值在预设误差阈值范围内的图像,形成原始动画组;
将所述原始动画组中的图像按照生成时间顺序进行排列,建立一原始动画矩阵;
对所述原始动画矩阵进行矩阵归一化处理,得到归一化的原始动画矩阵,提取所述归一化原始动画矩阵中的元素,打包成归一化动画组。
在其中一个实施例中,所述获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本,包括:
获取执行制图函数的执行语句,抽取所述执行语句中包含的函数调用信息;
根据所述函数调用信息,获得网页适配的制图函数版本信息;
根据所述制图函数版本信息,获取此版本下的图像绘制函数和图像位置函数;
将所述预设的动态播放参数分别入参到所述图像绘制函数和所述图像位置函数,汇总出参结果得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本。
在其中一个实施例中,所述获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画,包括:
根据所述动画运动参数,获取原始动画样本中关键帧的起始时间点和终止时间点,在对应所述起始时间点的动画帧中加入相应的图像渲染动画帧;
获取所述关键帧在所述终止时间点的动画参数和动画时长,根据预设的帧频,计算得到下一动画帧中所述图像的变化动画参数;
以所述变化动画参数的参数值为依据,渲染所述下一动画帧;
依次渲染所述原始动画样本中的所有图像,形成最终动画。
在其中一个实施例中,在所述获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画之后,还包括对所述最终动画进行播放验证,具体包括:
接收外部输入的动画播放操作指令,抽取所述操作指令中所包含的动画播放的开始节点和终止节点;
根据所述开始节点和所述终止节点,得到所述最终动画中对应的开始图像和终止图像;
播放所述最终动画中从所述开始图像至所述终止图像中的动画片段,记录所述动画片段中每一个图像在显示页面的初始显示位置、最终显示位置和停留时间长度;
将所述初始显示位置、所述最终显示位置和所述停留时间长度与存储在数据库中的所述最终动画的实际初始显示位置、实际最终显示位置和实际停留时间长度进行比对,若在预设的误差阈值以内,则通过验证,否则按照所述最终动画的实际的初始显示位置、实际最终显示位置和实际停留时间长度对所述最终动画进行修正。
在其中一个实施例中,所述根据所述函数调用信息,获得网页适配的制图函数版本信息,包括:
获取函数调用信息中所包含的自变量参数;
遍历系统的各个数据接口,获得所有使用所述自变量参数的数据接口;
获取所述所有使用所述自变量参数的数据接口进行制图函数运算后得到的出参信息;
检测所述出参信息的一致性,若任意两个出参信息完全一致则归为一信息组,统计各个所述信息组中的数据量,将数据量最多的所述信息组所对应的版本信息作为所述制图函数版本信息。
一种网页动画绘制装置,包括如下模块:
动画参数获取模块,设置为获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;
动画组生成模块,设置为根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组;
原始动画样本模块,设置为获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;
最终动画模块,设置为获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画。
一种计算机设备,包括存储器和处理器,所述存储器中存储有计算机可读指令,所述计算机可读指令被所述处理器执行时,使得所述处理器执行上述网页动画绘制方法的步骤。
一种存储有计算机可读指令的存储介质,所述计算机可读指令被一个或多个处理器执行时,使得一个或多个处理器执行上述网页动画绘制方法的步骤。
上述网页动画绘制方法、装置、计算机设备和存储介质,包括获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组;获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画。本技术方案针对不能根据用户需求及时对动画内容进行及时有效绘制的问题,通过建立动画组作为模板,然后用户输入的参数自动生成用户所需的动画效果。
附图说明
通过阅读下文优选实施方式的详细描述,各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本申请的限制。
图1为本申请在一个实施例中的一种网页动画绘制方法的整体流程图;
图2为本申请在一个实施例中的一种网页动画绘制方法中的动画组生成过程示意图;
图3为本申请在一个实施例中的一种网页动画绘制方法中的生成最终动画过程示意图;
图4为本申请在一个实施例中的一种网页动画绘制装置的结构图。
具体实施方式
为了使本申请的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本申请进行进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本申请,并不用于限定本申请。
本技术领域技术人员可以理解,除非特意声明,这里使用的单数形式“一”、“一个”、“所述”和“该”也可包括复数形式。应该进一步理解的是,本申请的说明书中使用的措辞“包括”是指存在所述特征、整数、步骤、操作、元件和/或组件,但是并不排除存在或添加一个或多个其他特征、整数、步骤、操作、元件、组件和/或它们的组。
图1为本申请在一个实施例中的一种网页动画绘制方法的整体流程图,如图1所示,一种网页动画绘制方法,包括以下步骤:
S1,获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;
具体的,动画图像参数是决定动画的最终显示效果的参数,图像样式参数用于描述动画主体的整体样式,如雨滴、雪花等。图像属性参数用于描述动画主体的显示状态,包括静态和动态的状态,由于动画是动态的,图像属性参数包括运动速度,可通过运动速度得到动画主体在画布中不同帧具体的位置,其中一个物体对象就是一个动画主体,图像属性参数的种类和数值可根据需要展现的动画效果自定义。
S2,根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组;
具体的,在预设的图像样本集中的图像素材主要是各种图形的形状,在进行图像抽取时,可以将图像素材进行叠加组合形成数个新的素材;属性归一化主要是指对对图像的格式进行归一化,比如将不同格式的图像文件,统一成.jpg格式,以便于参数的设置。
S3,获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;
具体的,具体的,本步骤中所使用的制图函数可以采用javascript脚本中所包含的函数,为javascript,是一种由Netscape的LiveScript发展而来的脚本语言,主要目的是为了解决服务器终端语言遗留的速度问题。在此步骤中,还可以对javascript所包含的脚本函数进行优化:对JavaScript脚本函数的优化标识进行解析,以生成对应于所述优化标识的优化权值,利用优化权值对JavaScript脚本函数进行优化。
S4、获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画。
具体的,帧就是动画中最小单位的单幅影像画面,相当于电影胶片上的每一格镜头。在动画软件的时间轴上帧表现为一格或一个标记。关键帧相当于二维动画中的原画。指角色或者物体运动或变化中的关键动作所处的那一帧。关键帧与关键帧之间的动画可以由软件来创建,叫做过渡帧或者中间帧。
本实施例,通过建立原始动画样本,便于提升用户进行动画绘制时的速度。
在一个实施例中,所述获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数,包括:
获取第一动画图像参数,所述第一动画图像参数包括图像样式参数;
具体的,图像样式参数主要是指图像的尺寸和图像中各个几何图像的组合以及颜色信息等。
根据动画播放组件的参数,判断所述第一动画图像参数是否满足动画组件参数条件;
具体的,动画播放组件可以是Flash插件等,根据Flash插件的版本信息可以得到满足其正常播放的参数信息,具体参数可以是播放时间间隔,图像尺寸,像素质量等。
若满足,则将所述第一动画参数作为所述动画图像参数;
若不满足,则获取所述图像样式参数对应的默认图像属性参数,根据所述默认图像属性参数生成满足动画组件播放参数条件的动画图像参数。
本实施例,通过对动画参数进行规定,使其能够满足播放的要求,以便进行下一步骤。
图2为本申请在一个实施例中的一种网页动画绘制方法中的动画组生成过程示意图,如图所示,所述根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组,包括:
S201、获取新增动画请求信息,抽取出所述新增动画请求信息中所包含的图像样式参数和图像属性参数;
具体的,对新增动画请求进行特征字符查询,根据查询结果中包含的样式条目对应的字符和属性信息对应的字符,来对上述条目下的数值信息进行提取。
S202、根据图像样式参数查询所述预设的图像样本集,抽取与所述图像样式参数的差值在预设误差阈值范围内的图像,形成原始动画组;
具体的,先对样式参数所对应的图形形状进行断定,即输入的图像样式信息进行解析所对应的图形的轮廓是矩形、三角形还是圆形进行判断,在进行判断时,可以采用投票机制,若某一区域的图形不能直接判断,则进行投票,根据投票的结果确定该区域的形状。
S203、将所述原始动画组中的图像按照生成时间顺序进行排列,建立一原始动画矩阵;
具体的,根据每一张原始动画组中的图像中面积最大的颜色的RGB数值,赋予该图像以数值,然后根据该图像的生成时间顺序进行排列,然后建立原始动画矩阵
S204、对所述原始动画矩阵进行矩阵归一化处理,得到归一化的原始动画矩阵,提取所述归一化原始动画矩阵中的元素,打包成归一化动画组。
具体的,在进行归一化处理时,可以先对矩阵中的元素进行二值化处理,然后在利用矩阵归一化的规则进行矩阵归一化。
本实施例,通过对动画组进行归一化处理,可以加快生成动画的速度,从而在用户自定义设计动画时,加快处理速度。
在其中一个实施例中,所述获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本,包括:
获取执行制图函数的执行语句,抽取所述执行语句中包含的函数调用信息;
其中,执行语句中包括函数调用信息,还包括执行时间等信息。
根据所述函数调用信息,获得网页适配的制图函数版本信息;
具体的,在获取制图函数版本信息时,获取制图函数在系统中各个接口的使用情况,先获取各个接口中相同的自变量,然后记录此自变量经过运算后得到的出参结果,若出参结果一致,则说明在这两个接口处的制图函数版本一致,若不一致则说明在这两个接口处的制图函数的版本一致,统计各个接口得到出参结果,以出参结果中出现次数最多的一个结果所对应的版本,作为该制图函数的版本。
根据所述制图函数版本信息,获取此版本下的图像绘制函数和图像位置函数;
将所述预设的动态播放参数分别入参到所述图像绘制函数和所述图像位置函数,汇总出参结果得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本。
具体的,制图函数可以使用JavaScript脚本函数,其中JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。可在JavaScript脚本编写中采用jQuery。jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,DoMore”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax(Asynchronous Javascript And XML)交互。
本实施例,通过建立原始动画样本,方便用户在进行自定义设计动画时的效率,同时也可以对设计过程进行记录。
图3为本申请在一个实施例中的一种网页动画绘制方法中的生成最终动画过程示意图,如图所示,所述获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画,包括:
S401、根据所述动画运动参数,获取原始动画样本中关键帧的起始时间点和终止时间点,在对应所述起始时间点的动画帧中加入相应的图像渲染动画帧;
具体的,关键帧分为引导层关键帧和空白关键帧,其中引导层关键帧(基于引导图层创建的普通关键帧,该种关键帧在播放flash影片时是不可见的,仅用于注释flash影片),空白关键帧是没有任何对象存在的帧,主要用于在画面与画面之间形成间隔,它在时间轴上是以空心圆的形式显示,用户可以在其上绘制图形,一旦在空白关键帧中创建了内容,空白关键帧就会自动转变为关键帧,按F7快捷键可创建空白关键帧。一般新建图层的第1帧都是空白关键帧,如果在其中绘制图形,则会自动变为关键帧,同理,如果将某关键帧中的对象全部删除,则这个关键帧就会转变为空白关键帧。
S402、获取所述关键帧在所述终止时间点的动画参数和动画时长,根据预设的帧频,计算得到下一动画帧中所述图像的变化动画参数;
具体的,在计算变化动画参数时,首先对每一个动画参数进行标记,可以采用颜色标记的方式,若某一个动画参数的数值未发生变化则颜色不变,而发生变化则发生颜色更改,然后将颜色发生更改的时间节点与预设的节点进行比对,若一致则进行下一步骤,否则重新计算。
S403、以所述变化动画参数的参数值为依据,渲染所述下一动画帧;
具体的,获取变化后的动画参数,根据动画参数的二维数值对应的三维参数对动画机型渲染。
S404、依次渲染所述原始动画样本中的所有图像,形成最终动画。
本实施例,通过对原始动画样本进行渲染,使得最终动画符合用户的实际需求。
在一个实施例中,在所述获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画之后,还包括对所述最终动画进行播放验证,具体包括:
接收外部输入的动画播放操作指令,抽取所述操作指令中所包含的动画播放的开始节点和终止节点;
具体的,接收外部输入的动画播放操作指令,对播放操作指令进行信息识别,识别出操作指令中所包含的所有时间信息,然后将这些时间信息按照先后顺序进行排序,获取最早的时刻和最晚的时刻,分别作为播放的起点和终点。
根据所述开始节点和所述终止节点,得到所述最终动画中对应的开始图像和终止图像;
播放所述最终动画中从所述开始图像至所述终止图像中的动画片段,记录所述动画片段中每一个图像在显示页面的初始显示位置、最终显示位置和停留时间长度;
具体的,所谓显示位置是指图像在播放时时处于屏幕正中,即图像的正常位置,还是图像处于飘入屏幕或者飘出屏幕的状态,通过记录图像最开始飘入屏幕的时间节点和最后飘出屏幕的时间节点可以确定该图像在屏幕上的停留时间长度。
将所述初始显示位置、所述最终显示位置和所述停留时间长度与存储在数据库中的所述最终动画的实际初始显示位置、实际最终显示位置和实际停留时间长度进行比对,若在预设的误差阈值以内,则通过验证,否则按照所述最终动画的实际的初始显示位置、实际最终显示位置和实际停留时间长度对所述最终动画进行修正。
具体的,在进行修正时可以将位置信息等输入到误差修正模型中进行训练,以实际情况为标准样本,以预存的信息为训练样本进行训练。
本实施例,通过对制作完成的动画进行播放,能够有效修正动画制造过程中产生的错误。
在一个实施例中,所述根据所述函数调用信息,获得网页适配的制图函数版本信息,包括:
获取函数调用信息中所包含的自变量参数;
具体的,在进行自变量参数获取过程中,可以获取多个自变量参数分别入参到一个函数中进行运算,这样可以提升函数版本确定的准确性。
遍历系统的各个数据接口,获得所有使用所述自变量参数的数据接口;
获取所述所有使用所述自变量参数的数据接口进行制图函数运算后得到的出参信息;
检测所述出参信息的一致性,若任意两个出参信息完全一致则归为一信息组,统计各个所述信息组中的数据量,将数据量最多的所述信息组所对应的版本信息作为所述制图函数版本信息。
具体的,在进行版本信息确定时,若两个版本信息的数据量是一样多,则选取其它自变量作为入参条件进行重新计算。
本实施例,通过对函数版本信息的判断,可以使系统更好的完成动画绘制的工作。
在一个实施例中,提出了网页动画绘制装置,如图4所示,包括如下模块:
动画参数获取模块,设置为获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;
动画组生成模块,设置为根据所述图像样式参数,从预设的图像样本集中抽取出图像素材,形成原始动画组,根据所述图像属性参数对所述原始动画组中的图像进行属性归一化处理得到归一化动画组;
原始动画样本模块,设置为获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;
最终动画模块,设置为获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画。
一种计算机设备,包括存储器和处理器,所述存储器中存储有计算机可读指令,所述计算机可读指令被所述处理器执行时,使得所述处理器执行上述网页动画绘制方法的步骤。
一种存储有计算机可读指令的存储介质,所述计算机可读指令被一个或多个处理器执行时,使得一个或多个处理器执行上述网页动画绘制方法的步骤。所述存储介质可以为非易失性存储介质。
本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成,该程序可以存储于一计算机可读存储介质中,存储介质可以包括:只读存储器(ROM,Read Only Memory)、随机存取存储器(RAM,RandomAccess Memory)、磁盘或光盘等。
以上所述实施例的各技术特征可以进行任意的组合,为使描述简洁,未对上述实施例中的各个技术特征所有可能的组合都进行描述,然而,只要这些技术特征的组合不存在矛盾,都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本申请一些示例性实施例,其中描述较为具体和详细,但并不能因此而理解为对本申请专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本申请构思的前提下,还可以做出若干变形和改进,这些都属于本申请的保护范围。因此,本申请专利的保护范围应以所附权利要求为准。
Claims (9)
1.一种网页动画绘制方法,其特征在于,包括:
获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;
根据所述图像样式参数,从预设的图像样本集中抽取出与所述图像样式参数的差值在预设误差阈值范围内的图像素材,形成原始动画组,基于所述原始动画组中图像的生成时间顺序,对所述原始动画组进行排序,得到原始动画矩阵,并对所述原始动画矩阵进行矩阵归一化处理,得到归一化的原始动画矩阵,提取所述归一化的原始动画矩阵中的元素,打包成归一化动画组;
获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;
获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画;接收外部输入的动画播放操作指令,抽取所述操作指令中所包含的动画播放的开始节点和终止节点;根据所述开始节点和所述终止节点,得到所述最终动画中对应的开始图像和终止图像;播放所述最终动画中从所述开始图像至所述终止图像中的动画片段,记录所述动画片段中每一个图像在显示页面的初始显示位置、最终显示位置和停留时间长度;将所述初始显示位置、所述最终显示位置和所述停留时间长度与存储在数据库中的所述最终动画的实际初始显示位置、实际最终显示位置和实际停留时间长度进行比对,若在预设的误差阈值以内,则通过验证,否则按照所述最终动画的实际的初始显示位置、实际最终显示位置和实际停留时间长度对所述最终动画进行修正。
2.根据权利要求1所述的网页动画绘制方法,其特征在于,所述获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数,包括:
获取第一动画图像参数,所述第一动画图像参数包括图像样式参数;
根据动画播放组件的参数,判断所述第一动画图像参数是否满足动画组件参数条件;
若满足,则将所述第一动画图像参数作为所述动画图像参数;
若不满足,则获取所述图像样式参数对应的默认图像属性参数,根据所述默认图像属性参数生成满足动画组件播放参数条件的动画图像参数。
3.根据权利要求1所述的网页动画绘制方法,其特征在于,所述根据所述图像样式参数,从预设的图像样本集中抽取出与所述图像样式参数的差值在预设误差阈值范围内的图像素材,形成原始动画组,基于所述原始动画组中图像的生成时间顺序,对所述原始动画组进行排序,得到原始动画矩阵,并对所述原始动画矩阵进行矩阵归一化处理,得到归一化的原始动画矩阵,提取所述归一化的原始动画矩阵中的元素,打包成归一化动画组,包括:
获取新增动画请求信息,抽取出所述新增动画请求信息中所包含的图像样式参数和图像属性参数;
根据图像样式参数查询所述预设的图像样本集,抽取与所述图像样式参数的差值在预设误差阈值范围内的图像,形成原始动画组;
将所述原始动画组中的图像按照生成时间顺序进行排列,建立一原始动画矩阵;
对所述原始动画矩阵进行矩阵归一化处理,得到归一化的原始动画矩阵,提取所述归一化的原始动画矩阵中的元素,打包成归一化动画组。
4.根据权利要求1所述的网页动画绘制方法,其特征在于,所述获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本,包括:
获取执行制图函数的执行语句,抽取所述执行语句中包含的函数调用信息;
根据所述函数调用信息,获得网页适配的制图函数版本信息;
根据所述制图函数版本信息,获取此版本下的图像绘制函数和图像位置函数;
将所述预设的动态播放参数分别入参到所述图像绘制函数和所述图像位置函数,汇总出参结果得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本。
5.根据权利要求1所述的网页动画绘制方法,其特征在于,所述获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画,包括:
根据所述动画运动参数,获取原始动画样本中关键帧的起始时间点和终止时间点,在对应所述起始时间点的动画帧中加入相应的图像渲染动画帧;
获取所述关键帧在所述终止时间点的动画参数和动画时长,根据预设的帧频,计算得到下一动画帧中所述图像的变化动画参数;
以所述变化动画参数的参数值为依据,渲染所述下一动画帧;
依次渲染所述原始动画样本中的所有图像,形成最终动画。
6.根据权利要求4所述的网页动画绘制方法,其特征在于,所述根据所述函数调用信息,获得网页适配的制图函数版本信息,包括:
获取函数调用信息中所包含的自变量参数;
遍历系统的各个数据接口,获得所有使用所述自变量参数的数据接口;
获取所述所有使用所述自变量参数的数据接口进行制图函数运算后得到的出参信息;
检测所述出参信息的一致性,若任意两个出参信息完全一致则归为一信息组,统计各个所述信息组中的数据量,将数据量最多的所述信息组所对应的版本信息作为所述制图函数版本信息。
7.一种网页动画绘制装置,其特征在于,包括:
动画参数获取模块,设置为获取动画图像参数,所述动画图像参数包括图像样式参数和图像属性参数;
动画组生成模块,设置为根据所述图像样式参数,从预设的图像样本集中抽取出与所述图像样式参数的差值在预设误差阈值范围内的图像素材,形成原始动画组,基于所述原始动画组中图像的生成时间顺序,对所述原始动画组进行排序,得到原始动画矩阵,并对所述原始动画矩阵进行矩阵归一化处理,得到归一化的原始动画矩阵,提取所述归一化的原始动画矩阵中的元素,打包成归一化动画组;
原始动画样本模块,设置为获取预设的动态播放参数,将所述预设的动态播放参数入参到制图函数中进行运算,出参后得到动画运动速度参数,根据所述动画运动参数,设置所述归一化动画组中各个图像停留时间后形成原始动画样本;
最终动画模块,设置为获取原始动画样本中的关键帧,根据所述关键帧的特征属性,渲染所述原始动画样本中的所有图像,形成最终动画;接收外部输入的动画播放操作指令,抽取所述操作指令中所包含的动画播放的开始节点和终止节点;根据所述开始节点和所述终止节点,得到所述最终动画中对应的开始图像和终止图像;播放所述最终动画中从所述开始图像至所述终止图像中的动画片段,记录所述动画片段中每一个图像在显示页面的初始显示位置、最终显示位置和停留时间长度;将所述初始显示位置、所述最终显示位置和所述停留时间长度与存储在数据库中的所述最终动画的实际初始显示位置、实际最终显示位置和实际停留时间长度进行比对,若在预设的误差阈值以内,则通过验证,否则按照所述最终动画的实际的初始显示位置、实际最终显示位置和实际停留时间长度对所述最终动画进行修正。
8.一种计算机设备,包括存储器和处理器,所述存储器中存储有计算机可读指令,所述计算机可读指令被所述处理器执行时,使得所述处理器执行如权利要求1至6中任一项权利要求所述网页动画绘制方法的步骤。
9.一种存储有计算机可读指令的存储介质,所述计算机可读指令被一个或多个处理器执行时,使得一个或多个处理器执行如权利要求1至6中任一项权利要求所述网页动画绘制方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811388998.1A CN109658485B (zh) | 2018-11-21 | 2018-11-21 | 网页动画绘制方法、装置、计算机设备和存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811388998.1A CN109658485B (zh) | 2018-11-21 | 2018-11-21 | 网页动画绘制方法、装置、计算机设备和存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN109658485A CN109658485A (zh) | 2019-04-19 |
CN109658485B true CN109658485B (zh) | 2024-05-28 |
Family
ID=66112149
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201811388998.1A Active CN109658485B (zh) | 2018-11-21 | 2018-11-21 | 网页动画绘制方法、装置、计算机设备和存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109658485B (zh) |
Families Citing this family (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112001988A (zh) * | 2019-05-27 | 2020-11-27 | 珠海金山办公软件有限公司 | 一种动画效果生成方法及装置 |
CN112308947A (zh) * | 2019-07-25 | 2021-02-02 | 腾讯科技(深圳)有限公司 | 一种动画的生成方法、装置及存储介质 |
CN110636320A (zh) * | 2019-09-24 | 2019-12-31 | 网易(杭州)网络有限公司 | 用于直播的动画生成方法、装置、存储介质与电子设备 |
CN110662105A (zh) * | 2019-10-16 | 2020-01-07 | 广州华多网络科技有限公司 | 动画文件的生成方法、装置及存储介质 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101594551A (zh) * | 2008-05-26 | 2009-12-02 | 鸿富锦精密工业(深圳)有限公司 | 图像显示测试方法 |
CN105657574A (zh) * | 2014-11-12 | 2016-06-08 | 阿里巴巴集团控股有限公司 | 一种视频文件制作方法以及装置 |
CN107608993A (zh) * | 2016-07-12 | 2018-01-19 | 腾讯科技(深圳)有限公司 | 网页动画生成的方法和装置 |
CN108196964A (zh) * | 2017-12-29 | 2018-06-22 | 北京奇虎科技有限公司 | 一种将数据流模块化的方法和装置 |
-
2018
- 2018-11-21 CN CN201811388998.1A patent/CN109658485B/zh active Active
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101594551A (zh) * | 2008-05-26 | 2009-12-02 | 鸿富锦精密工业(深圳)有限公司 | 图像显示测试方法 |
CN105657574A (zh) * | 2014-11-12 | 2016-06-08 | 阿里巴巴集团控股有限公司 | 一种视频文件制作方法以及装置 |
CN107608993A (zh) * | 2016-07-12 | 2018-01-19 | 腾讯科技(深圳)有限公司 | 网页动画生成的方法和装置 |
CN108196964A (zh) * | 2017-12-29 | 2018-06-22 | 北京奇虎科技有限公司 | 一种将数据流模块化的方法和装置 |
Also Published As
Publication number | Publication date |
---|---|
CN109658485A (zh) | 2019-04-19 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109658485B (zh) | 网页动画绘制方法、装置、计算机设备和存储介质 | |
CN109801347B (zh) | 一种可编辑图像模板的生成方法、装置、设备和介质 | |
CN113609820B (zh) | 基于可扩展标记语言文件生成word文件的方法、装置及设备 | |
CN111428457B (zh) | 数据表的自动格式化 | |
CN111752557A (zh) | 一种展示方法及装置 | |
CN111144370A (zh) | 单据要素抽取方法、装置、设备及存储介质 | |
US20220383381A1 (en) | Video generation method, apparatus, terminal and storage medium | |
CN112417338A (zh) | 一种页面适配方法、系统及设备 | |
CN109656652B (zh) | 网页图表绘制方法、装置、计算机设备和存储介质 | |
CN106776994B (zh) | 一种工程符号在工程报表和网页中的应用方法及系统 | |
CN114791988A (zh) | 一种基于浏览器的pdf文件解析方法、系统、存储介质 | |
CN116610304B (zh) | 页面代码生成方法、装置、设备和存储介质 | |
CN111428452B (zh) | 一种批注数据保存方法及装置 | |
CN110162301B (zh) | 一种表单渲染方法、装置和存储介质 | |
CN117576388A (zh) | 一种图像处理方法、装置、存储介质及电子设备 | |
CN117093386A (zh) | 页面截图方法、装置、计算机设备和存储介质 | |
CN116225956A (zh) | 自动化测试方法、装置、计算机设备和存储介质 | |
CN115170695A (zh) | 图表图片的生成方法、装置、电子设备和存储介质 | |
CN112558894B (zh) | 基于canvas的动态网页打印方法、系统及存储介质 | |
CN113936187A (zh) | 文本图像合成方法、装置、存储介质及电子设备 | |
CN112698898A (zh) | 一种播放盒终端热力图快照生成方法及系统 | |
US20130104014A1 (en) | Viewer unit, server unit, display control method, digital comic editing method and non-transitory computer-readable medium | |
CN111651969A (zh) | 样式迁移 | |
US20240169143A1 (en) | Method and system of generating an editable document from a non-editable document | |
CN116595284B (zh) | 网页系统运行方法、装置、设备、存储介质和程序 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |