您的位置：首页 > 其它

精图规范1.0----19 动画 Animation

2014-06-14 20:13 351 查看
previous

next
contents
elements
attributes
properties
index

04September2001

19动画Animation

内容Contents

19.1引言Introduction

19.2动画元素Animationelements

19.2.1概览Overview

19.2.2与SMIL动画之间的关系RelationshiptoSMILAnimation

19.2.3动画元素的例子Animationelementsexample

19.2.4标识一个动画目标元素的性质Attributestoidentifythetargetelementforananimation

19.2.5标识一个动画目标性质或属性的性质Attributestoidentifythetargetattributeorpropertyforananimation

19.2.6控制动画时间的性质Attributestocontrolthetimingoftheanimation

19.2.7定义时间方面动画值的性质Attributesthatdefineanimationvaluesovertime

19.2.8控制动画是否为叠加的性质Attributesthatcontrolwhetheranimationsareadditive

19.2.9继承Inheritance

19.2.10'animate'元素The'animate'element

19.2.11'set'元素The'set'element

19.2.12'animateMotion'元素The'animateMotion'element

19.2.13'animateColor'元素The'animateColor'element

19.2.14'animateTransform'元素The'animateTransform'element

19.2.15可以进行动画的元素,性质和属性Elements,attributesandpropertiesthatcanbeanimated

19.3利用精图文档对象模型的动画AnimationusingtheSVGDOM

19.4文档对象模型接口DOMinterfaces

19.1引言Introduction

因为环球网是一种动态的媒体,精图支持在时间上改变矢量图形的能力.精图内容可以按照下列方式进行动画:BecausetheWebisadynamicmedium,SVGsupportstheabilitytochangevectorgraphicsovertime.SVGcontentcanbeanimatedinthefollowingways:

使用精图的
动画元素.精图文档片段可以描述对文档元素进行基于时间的修改.使用各种动画元素,你可以定义运动路径,淡入或淡出效果,以及对象的扩大,收缩,旋转或改变颜色.UsingSVG's

animationelements.SVGdocumentfragmentscandescribetime-basedmodificationstothedocument'selements.Usingthevariousanimationelements,youcandefinemotionpaths,fade-inorfade-outeffects,andobjectsthatgrow,shrink,spinorchangecolor.

使用
精图文档对象模型.精图文档对象模型与"文档对象模型(DOM)级别1"[DOM1]以及"文档对象模型(DOM)级别2"[DOM2]规范的主要方面保持兼容.每一性质和样式表的设置对脚本而言是可存取的,并且精图提供一套附加的文档对象模型接口来支持通过脚本所进行的动画.
其结果是,事实上可以进行任何种类的动画.在脚本语言比如ECMAScript中的时间机制可以用来启动和控制动画.(参见下面的
例子.)Usingthe
SVGDOM.TheSVGDOMconformstokeyaspectsofthe"DocumentObjectModel(DOM)Level1"[DOM1]and"DocumentObjectModel(DOM)Level2"[DOM2]
specifications.Everyattributeandstylesheetsettingisaccessibletoscripting,andSVGoffersasetofadditionalDOMinterfacestosupportefficientanimationviascripting.Asaresult,virtuallyanykindofanimationcanbeachieved.Thetimerfacilities
inscriptinglanguagessuchasECMAScriptcanbeusedtostartupandcontroltheanimations.(See

examplebelow.)
精图被设计成允许未来版本的SMIL[SMIL1]使用动画的或者静态的精图内容作为媒体部件.SVGhasbeendesignedtoallowfutureversionsofSMIL[SMIL1]touseanimatedor
staticSVGcontentasmediacomponents.
在将来,期望未来版本的SMIL将被模块化并且它的组件可以与精图和其它XML语法相结合来完成动画效果.Inthefuture,itisexpectedthatfutureversionsofSMILwillbemodularizedandthatcomponentsofitcouldbeusedinconjunctionwithSVGandotherXMLgrammarstoachieveanimationeffects.

19.2动画元素Animationelements

19.2.1概览Overview

精图动画元素是在与W3C同步多媒体(SYMM)工作组的协作下进行开发的,此开发组即同步多媒体集成语言(SMIL)1.0规范[SMIL1]的开发者.SVG'sanimationelementsweredevelopedincollaborationwiththeW3CSynchronizedMultimedia(SYMM)WorkingGroup,
developersoftheSynchronizedMultimediaIntegrationLanguage(SMIL)1.0Specification[SMIL1].

SYMM工作组,在与精图工作组的协作过程中,已经创作SMIL动画规范[SMILANIM],此规范表示一种通用目的的XML动画特征集.精图与定义在SMIL动画规范相结合并提供某些针对精图的扩展.TheSYMMWorkingGroup,incollaborationwiththeSVGWorking
Group,hasauthoredtheSMILAnimationspecification[SMILANIM],whichrepresentsageneral-purposeXMLanimationfeatureset.SVGincorporatestheanimationfeaturesdefined
intheSMILAnimationspecificationandprovidessomeSVG-specificextensions.

关于在任何支持SMIL动画的语言中可用的方法与特征的介绍,请参见
SMIL动画概览以及
SMIL动画的动画模型.关于动画之外的动画特征的列表,请参见
对SMIL动画的精图扩展.ForanintroductiontotheapproachandfeaturesavailableinanylanguagethatsupportsSMILAnimation,see

SMILAnimationoverviewand
SMILAnimationanimationmodel.ForthelistofanimationfeatureswhichgobeyondSMILAnimation,see

SVGextensionstoSMILAnimation.

19.2.2与SMIL动画的关系RelationshiptoSMILAnimation

精图是SMIL动画的宿主语言故引入了一些那个规范所允许的增加的约束和特征.除了在此规范中被特别明显地说明的精图特定的规则外,精图的动画元素和性质的正式定义在SMIL动画[SMILANIM]规范中.SVGisahostlanguageintermsofSMILAnimationandtherefore
introducesadditionalconstraintsandfeaturesaspermittedbythatspecification.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforSVG'sanimationelementsandattributesistheSMILAnimation[SMILANIM]specification.

精图支持在SMIL动画规范种定义的四种动画元素:SVGsupportsthefollowingfouranimationelementswhicharedefinedintheSMILAnimationspecification:

'animate'

允许标量的性质和属性的值随时间不同而指派不同的值allowsscalarattributesandpropertiestobeassigneddifferentvaluesovertime

'set'

'animate'的方便的简写,用于对于非数值的性质和属性指派动画值,比如
'visibility'属性aconvenientshorthandfor'animate',whichisusefulforassigninganimationvaluestonon-numericattributesandproperties,suchasthe

'visibility'property

'animateMotion'

沿着一条运动路径移动一个元素movesanelementalongamotionpath

'animateColor'

随着时间的变化而修改特定性质或属性的颜色值modifiesthecolorvalueofparticularattributesorpropertiesovertime

另外,精图包含下列对SMIL动画的兼容的扩展:Additionally,SVGincludesthefollowingcompatibleextensionstoSMILAnimation:

'animateTransform'

随着时间的变化而修改精图变换性质之一,比如transform性质modifiesoneofSVG'stransformationattributesovertime,suchasthe
transformattribute

pathattribute

精图允许在
path性质中指定的精图的
路径数据语法的特征被指定到
'animateMotion'元素中(SMIL动画仅允许在path性质中精图路径数据语法的一个子集)SVGallowsanyfeaturefromSVG's

pathdatasyntaxtobespecifiedina
pathattributetothe
'animateMotion'element(SMILAnimationonlyallowsasubsetofSVG'spathdatasyntaxwithinapathattribute)

'mpath'element

精图允许一个
'animateMotion'元素包含子
'mpath'元素此元素引用一个精图
'path'元素作为其运动路径的定义SVGallowsan
'animateMotion'elementtocontainachild
'mpath'elementwhichreferencesanSVG
'path'elementasthedefinitionofthemotionpath

keyPointsattribute

精图加入keyPoints性质到
'animateMotion'中以便提供对运动路径动画的速度的精确控制SVGaddsakeyPointsattributetothe
'animateMotion'toprovideprecisecontrolofthevelocityofmotionpathanimations

rotateattribute

精图加入
rotate性质到
'animateMotion'中以便控制是否一个对象自动进行旋转使得其x-轴指向与运动路径的方向切向量相同的方向(或相反的方向)SVGaddsa

rotateattributetothe
'animateMotion'tocontrolwhetheranobjectisautomaticallyrotatedsothatitsx-axispointsinthesamedirection(oroppositedirection)asthedirectionaltangentvectorofthemotionpath

为了兼容此语言的其它方面,精图经由
xlink:href性质使用URI引用来标识将进行动画的目标元素.Forcompatibilitywithotheraspectsofthelanguage,SVGuses

URIreferencesviaan
xlink:hrefattributetoidentifytheelementswhicharetobetargetsoftheanimations.

SMIL动画要求宿主语言定义文档开始和文档结束的含义.因为一个

'svg'有时是XML文档树的根而其它时候又为一个父XML语法的组件,一个给定的精图文档片段的文档开始定义为严格的时间点即
'svg'元素的
onload事件被触发的时间.一个精图文档片段的文档结束The是此点即文档片段被释放并且用户代理不再处理此文档.SMILAnimationrequiresthatthehostlanguagedefinethemeaningfordocumentbeginandthedocumentend.Sincean

'svg'issometimestherootoftheXMLdocumenttreeandothertimescanbeacomponentofaparentXMLgrammar,the
documentbeginforagivenSVGdocumentfragmentisdefinedtobetheexacttimeatwhichthe

'svg'element's
onloadeventistriggered.ThedocumentendofanSVGdocumentfragmentisthepointatwhichthedocumentfragmenthasbeenreleasedandisnolongerbeingprocessedbytheuseragent.

对精图而言,术语表示时间
表示的是相对于给定文档片段的文档开始在时间轴上的位置.ForSVG,thetermpresentationtimeindicatesthepositioninthetimelinerelativetothe
documentbeginofagivendocumentfragment.

精图定义了比在SMIL动画[SMILANIM]规范中定义的更多的强制的错误处理.SMIL动画定义错误处理行为在某种错误的情形下文档仍然继续运行,而在精图文档片段内所有动画在文档中出现任何错误的事件时将停止(参见

错误处理).SVGdefinesmoreconstrainederrorprocessingthanisdefinedintheSMILAnimation[SMILANIM]specification.SMILAnimationdefineserrorprocessingbehaviorwhere
thedocumentcontinuestorunincertainerrorsituations,whereasallanimationswithinanSVGdocumentfragmentwillstopintheeventofanyerrorwithinthedocument(see

Errorprocessing).

19.2.3动画元素的例子Animationelementsexample

下面的Exampleanim01显示精图的五种动画元素的每一个.Exampleanim01belowdemonstrateseachofSVG'sfiveanimationelements.


<?xmlversion="1.0"standalone="no"?>

<!DOCTYPEsvgPUBLIC"-//W3C//DTDSVG20010904//EN"

"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

<svgwidth="8cm"height="3cm"viewBox="00800300"

xmlns="http://www.w3.org/2000/svg">

<desc>Exampleanim01-demonstrateanimationelements</desc>

<rectx="1"y="1"width="798"height="298"

fill="none"stroke="blue"stroke-width="2"/>


<!--Thefollowingillustratestheuseofthe'animate'element

toanimatearectanglesx,y,andwidthattributessothat

therectanglegrowstoultimatelyfilltheviewport.-->

<rectid="RectElement"x="300"y="100"width="300"height="100"

fill="rgb(255,255,0)">

<animateattributeName="x"attributeType="XML"

begin="0s"dur="9s"fill="freeze"from="300"to="0"/>

<animateattributeName="y"attributeType="XML"

begin="0s"dur="9s"fill="freeze"from="100"to="0"/>

<animateattributeName="width"attributeType="XML"

begin="0s"dur="9s"fill="freeze"from="300"to="800"/>

<animateattributeName="height"attributeType="XML"

begin="0s"dur="9s"fill="freeze"from="100"to="300"/>

</rect>


<!--Setupanewusercoordinatesystemsothat

thetextstring'soriginisat(0,0),allowing

rotationandscalerelativetotheneworigin-->

<gtransform="translate(100,100)">

<!--Thefollowingillustratestheuseofthe'set','animateMotion',

'animateColor'and'animateTransform'elements.The'text'element

belowstartsoffhidden(i.e.,invisible).At3seconds,it:

*becomesvisible

*continuouslymovesdiagonallyacrosstheviewport

*changescolorfrombluetodarkred

*rotatesfrom-30tozerodegrees

*scalesbyafactorofthree.-->

<textid="TextElement"x="0"y="0"

font-family="Verdana"font-size="35.27"visibility="hidden">

It'salive!

<setattributeName="visibility"attributeType="CSS"to="visible"

begin="3s"dur="6s"fill="freeze"/>

<animateMotionpath="M00L100100"

begin="3s"dur="6s"fill="freeze"/>

<animateColorattributeName="fill"attributeType="CSS"

from="rgb(0,0,255)"to="rgb(128,0,0)"

begin="3s"dur="6s"fill="freeze"/>

<animateTransformattributeName="transform"attributeType="XML"

type="rotate"from="-30"to="0"

begin="3s"dur="6s"fill="freeze"/>

<animateTransformattributeName="transform"attributeType="XML"

type="scale"from="1"to="3"additive="sum"

begin="3s"dur="6s"fill="freeze"/>

</text>

</g>

</svg>

Atzeroseconds

Atthreeseconds

Atsixseconds

Atnineseconds

Exampleanim01
ViewthisexampleasSVG(SVG-enabledbrowsersonly)

下列章节描述各种动画性质和元素.Thesectionsbelowdescribethevariousanimationattributesandelements.

19.2.4标识动画目标元素的性质Attributestoidentifythetargetelementforananimation
下列性质对所有动画元素是共同的并且用于标识动画目标元素.Thefollowingattributesarecommontoallanimationelementsandidentifythetargetelementfortheanimation.


<!ENTITY%animElementAttrs

"%xlinkRefAttrs;

xlink:href%URI;#IMPLIED">

性质定义:Attributedefinitions:

xlink:href="<uri>"

指向这一动画的目标的元素的URI引用从而随时可以被更改.A

URIreferencetotheelementwhichisthetargetofthisanimationandwhichthereforewillbemodifiedovertime.

目标元素必须是
当前精图文档片段的一部分.Thetargetelementmustbepartofthe
currentSVGdocumentfragment.

<uri>必须指向一个严格的目标元素此元素有能力成为给定动画的目标.如果<uri>指向多个目标元素,如果给定的目标元素不能成为给定的动画的目标,或者如果给定的目标元素不是当前精图文档片段的一部分,那么此文档是错误的(参见

错误处理).<uri>mustpointtoexactlyonetargetelementwhichiscapableofbeingthetargetofthegivenanimation.If<uri>pointstomultipletargetelements,ifthegiventargetelementisnotcapableofbeingatargetofthegivenanimation,orifthe
giventargetelementisnotpartofthecurrentSVGdocumentfragment,thenthedocumentisinerror(see

Errorprocessing).

如果不提供xlink:href性质,那么当前动画元素的直接父元素为其目标元素.Ifthexlink:hrefattributeisnotprovided,thenthetargetelementwillbetheimmediateparentelementofthecurrentanimationelement.

关于何种类型的元素可以成为特定类型动画的目标元素的限制请参考各自动画元素的描述.Refertothedescriptionsoftheindividualanimationelementsforanyrestrictionsonwhattypesofelementscanbetargetsofparticulartypesofanimations.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:
指定动画目标.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:Specifyingtheanimationtarget.

在别处定义的性质:Attributesdefinedelsewhere:

%xlinkRefAttrs;.

19.2.5标识动画目标性质或属性的性质Attributestoidentifythetargetattributeorpropertyforananimation
下列性质用来标识此给定的目标元素的目标性质或属性其值会随时间而改变.Thefollowingattributesidentifythetargetattributeorpropertyforthegiven

targetelementwhosevaluechangesovertime.


<!ENTITY%animAttributeAttrs

"attributeNameCDATA#REQUIRED

attributeTypeCDATA#IMPLIED">

性质定义:Attributedefinitions:

attributeName=
<attributeName>

指定目标性质的名字.一个XMLNS前缀可以用来表示此性质的XML命名空间.此前缀在当前(即,引用的)动画元素的作用域内进行解释.Specifiesthenameofthetargetattribute.AnXMLNSprefixmaybeusedtoindicatetheXMLnamespacefortheattribute.Theprefixwillbeinterpretedinthescopeofthecurrent(i.e.,
thereferencing)animationelement.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:
指定动画目标.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:Specifyingtheanimationtarget.

attributeType="CSS|XML|auto"

指定此目标性质以及它的相关的值被定义的命名空间.性质值为下列之一(值区分大小写):Specifiesthenamespaceinwhichthetargetattributeanditsassociatedvaluesaredefined.Theattributevalueisoneofthefollowing(valuesarecase-sensitive):

"CSS"

这指定"attributeName"的值为在此规范中定义的一个可进行动画的CSS属性的名字.Thisspecifiesthatthevalueof"attributeName"isthenameofaCSSpropertydefinedasanimatableinthisspecification.

"XML"

这指定"attributeName"的值为在缺省XML命名空间中为目标元素定义的一个XML性质的名字.如果
attributeName
的值有XMLNS前缀,实现者必须使用此相关的命名空间作为在目标元素的作用域定义的命名空间.在此规范中此性质必须定义为可进行动画的.Thisspecifiesthatthevalueof"attributeName"isthenameofanXMLattributedefinedinthedefault
XMLnamespaceforthetargetelement.Ifthevaluefor
attributeName
hasanXMLNSprefix,theimplementationmustusetheassociatednamespaceasdefinedinthescopeofthetargetelement.Theattributemustbedefinedasanimatableinthisspecification.

"auto"

实现者应该将
attributeName
与目标元素的性质相匹配.实现者必须先搜索CSS属性列表看是否有匹配的属性名,如果没有,在缺省的XML命名空间中查找此元素.Theimplementationshouldmatchthe
attributeName
toanattributeforthetargetelement.TheimplementationmustfirstsearchthroughthelistofCSSpropertiesforamatchingpropertyname,andifnoneisfound,searchthedefaultXMLnamespacefortheelement.

缺省值为"auto".Thedefaultvalueis"auto".

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:
指定动画目标.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:Specifyingtheanimationtarget.

19.2.6控制动画的播放时间的性质Attributestocontrolthetimingoftheanimation
下列性质对于所有动画元素是共同的它们用于控制动画的播放时间,包含什么情况下动画开始和结束,是否动画重复播放,以及是否一旦动画结束时是否保持动画最后的状态.Thefollowingattributesarecommontoallanimationelementsandcontrolthetimingoftheanimation,includingwhatcausestheanimationtostartandend,whethertheanimation
runsrepeatedly,andwhethertoretaintheendstatetheanimationoncetheanimationends.


<!ENTITY%animTimingAttrs

"beginCDATA#IMPLIED

durCDATA#IMPLIED

endCDATA#IMPLIED

minCDATA#IMPLIED

maxCDATA#IMPLIED

restart(always|never|whenNotActive)'always'

repeatCountCDATA#IMPLIED

repeatDurCDATA#IMPLIED

fill(remove|freeze)'remove'">

在以后的语法说明中,可选的空白符用"S"表示,定义如下:Inthesyntaxspecificationsthatfollow,optionalwhitespaceisindicatedas"S",definedasfollows:

S::=(#x20|#x9|#xD|#xA)*

性质定义:Attributedefinitions:
begin:begin-value-list

定义何时元素将开始(即.变成活动).Defineswhentheelementshouldbegin(i.e.becomeactive).

性质值是用分号分隔的值的列表.Theattributevalueisasemicolonseparatedlistofvalues.
begin-value-list::=
begin-value(S?";"S?begin-value-list)?

一个由分号分隔的开始值列表.开始值列表在SMIL动画的章节
"开始和结束时间列表的赋值"上有详细的解释.Asemicolonseparatedlistofbeginvalues.TheinterpretationofalistofbegintimesisdetailedinSMILAnimation'ssectionon

"Evaluationofbeginandendtimelists".
begin-value:(

offset-value|
syncbase-value|
event-value|
repeat-value|
accessKey-value|
wallclock-sync-value|
"indefinite")

描述元素的开始.Describestheelementbegin.

offset-value::=(S?"+"|"-"S?)?(

Clock-value)

对于SMIL动画而言,此值描述此元素的开始用一个隐含的同步基的偏移量来表示.对于精图而言,隐含的同步基开始定义为相对文档的开始.因为在精图中文档的结束总是未确定的,在精图中一个负的偏移量值总是一种错误.ForSMILAnimation,thisdescribestheelementbeginasanoffsetfromanimplicitsyncbase.ForSVG,theimplicitsyncbasebeginisdefinedtobe
relativetothedocumentbegin.SIncethedocumentendinSVGisalwaysundetermined,anegativeoffsetvalueinSVGisalwaysanerror.

syncbase-value::=(Id-value"."("begin"|"end"))(S?("+"|"-")S?

Clock-value)?

描述一个同步基以及一个可选的相对同步基的偏移量.元素的开始定义为相对此开始或另一个动画的结束.一个同步基由一个指向另一个动画元素由要么
begin
要么
end
标识是否与被引用的动画元素的开始或活动的结束同步的ID引用构成.Describesasyncbaseandanoptionaloffsetfromthatsyncbase.Theelementbeginisdefinedrelativetothebeginoractiveendofanotheranimation.AsyncbaseconsistsofanIDreference
toanotheranimationelementfollowedbyeither
begin
or
end
toidentifywhethertosynchronizewiththebeginningoractiveendofthereferencedanimationelement.

event-value::=(Id-value".")?(event-ref)(S?("+"|"-")S?

Clock-value)?

描述一个事件以及一个可选的确定元素开始的偏移量.动画开始定义为相对事件被触发的时间.一给定的基于事件的元素的可用的事件符号的列表是给定元素的由SVGDTD定义的可用事件性质的列表,不同之处在于开头的'on'将从事件名中移去(即,动画事件名为'click',而不是'onclick').
精图所支持的所有事件的列表可以在支持事件完全列表找到.基于事件的时间同步在SMIL动画:统一基于事件的同步和调度时间同步中有详细的描述
.Describesaneventandanoptionaloffsetthatdeterminetheelementbegin.Theanimationbeginisdefinedrelativetothetimethattheeventisraised.Thelistofevent-symbolsavailableforagivenevent-baseelementisthelistofeventattributesavailable
forthegivenelementasdefinedbythe
SVGDTD,withtheonedifferencethattheleading'on'isremovedfromtheeventname(i.e.,theanimationeventnameis'click',not'onclick').AlistofalleventssupportedbySVGcanbefoundin

Completelistofsupportedevents.Detailsofevent-basedtimingaredescribedin

SMILAnimation:UnifyingEvent-basedandScheduledTiming.

repeat-value::=(Id-value".")?"repeat("integer")"(S?("+"|"-")S?

Clock-value)?

描述一个有条件的重复事件.此元素开始定义为相对于指定反复值的重复事件被触发的时间.Describesaqualifiedrepeatevent.Theelementbeginisdefinedrelativetothetimethattherepeateventisraisedwiththespecifiediterationvalue.

accessKey-value::="accessKey("character")"(S?("+"|"-")S?

Clock-value)?

描述一个确定元素开始的一个accessKey.此元素开始定义为相对于此accessKey字符被用户输入的时间.DescribesanaccessKeythatdeterminestheelementbegin.TheelementbeginisdefinedrelativetothetimethattheaccessKeycharacterisinputbytheuser.

"wallclock-sync-value:wallclock("wallclock-value")"

描述元素开始当一个实时钟时间.实时钟时间的语法基于在[ISO8601]中定义的语法.Describestheelementbeginasareal-worldclocktime.Thewallclocktimesyntaxisbaseduponsyntaxdefinedin[ISO8601].

"indefinite"

动画的开始将由一个"beginElement()"方法调用或者一个目标指向此元素的超链接确定.Thebeginoftheanimationwillbedeterminedbya"beginElement()"methodcallorahyperlinktargetedtotheelement.

动画的DOM方法在文档对象模型接口中描述.TheanimationDOMmethodsaredescribedin

DOMinterfaces.

基于超链接的时间同步在SMIL动画:超链接和时间同步中描述.Hyperlink-basedtimingisdescribedin

SMILAnimation:Hyperlinksandtiming.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'begin'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'begin'attribute.

dur:
Clock-value|"media"|"indefinite"

指定简单的持续时间.Specifiesthesimpleduration.

性质值可以为下列情形之一:Theattributevaluecanbeeitherofthefollowing:

Clock-value

指定在表示时间中的简单的持续时间的长度.值必须大于0.Specifiesthelengthofthesimpledurationin

presentationtime.Valuemustbegreaterthan0.

"media"

指定媒体固有的持续时间作为简单的持续时间.这仅对定义媒体的元素有效.

(对于精图的
动画元素,如果"media"被指定,此性质将被忽略.)Specifiesthesimpledurationastheintrinsicmediaduration.Thisisonlyvalidforelementsthatdefinemedia.

(ForSVG's
animationelements,if"media"isspecified,theattributewillbeignored.)

"indefinite"

指定简单的持续时间为无限.Specifiesthesimpledurationasindefinite.

如果动画无dur性质,那么简单的持续时间为无限.注意如果简单的持续时间为无限那么插补将不工作(虽然这允许对
'set'元素仍然有用).除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'dur'
性质.Iftheanimationdoesnothaveadurattribute,thesimpledurationisindefinite.Notethatinterpolationwillnotworkifthesimpledurationisindefinite(althoughthismaystillbeusefulfor

'set'elements).ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'dur'attribute.

end:
end-value-list

定义动画的结束值此值限制活动的持续时间.此性质的值为分号分隔的值的列表.Definesanendvaluefortheanimationthatcanconstraintheactiveduration.Theattributevalueisasemicolonseparatedlistofvalues.

end-value-list::=

end-value(S?";"S?end-value-list)?

分号分隔的结束值的列表.结束时间的列表的详细解释如下.Asemicolonseparatedlistofendvalues.Theinterpretationofalistofendtimesisdetailedbelow.

end-value:(

offset-value|
syncbase-value|
event-value|
repeat-value|
accessKey-value|
wallclock-sync-value|"indefinite")

描述动画的活动结束时间.Describestheactiveendoftheanimation.

值为"indefinite"时指定动画的结束将由一个"endElement()"方法调用确定(动画的DOM方法在文档对象模型接口中描述).Avalueof"indefinite"specifiesthattheendoftheanimation
willbedeterminedbya"endElement()"methodcall(theanimationDOMmethodsaredescribedin

DOMinterfaces).

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'end'
性质.

min:
Clock-value|"media"

指定活动期间的最小值.Specifiestheminimumvalueoftheactiveduration.

性质值可以为下列情形之一:Theattributevaluecanbeeitherofthefollowing:

Clock-value

指定活动期间的最小值的长度,按本地时间计量.Specifiesthelengthoftheminimumvalueoftheactiveduration,measuredinlocaltime.

值必须大于0.Valuemustbegreaterthan0.

"media"

指定媒体固有的持续时间作为活动期间的最小值.这仅对定义媒体的元素有效.(对于精图的
动画元素,如果"media"被指定,此性质将被忽略.)Specifiestheminimumvalueoftheactivedurationastheintrinsicmediaduration.Thisisonlyvalidforelementsthatdefinemedia.(ForSVG's

animationelements,if"media"isspecified,theattributewillbeignored.)

min的缺省值为"0".此时完全不对活动期间进行限制.Thedefaultvalueforminis"0".Thisdoesnotconstraintheactivedurationatall.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'min'性质.Except
foranySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.Inparticular,
see
SMILAnimation:'min'attribute.

max:
Clock-value|"media"

指定活动期间的最大值.Specifiesthemaximumvalueoftheactiveduration.

性质值可以为下列情形之一:Theattributevaluecanbeeitherofthefollowing:

Clock-value

指定活动期间的最大值的长度,按本地时间计量.Specifiesthelengthofthemaximumvalueoftheactiveduration,measuredinlocaltime.

值必须大于0.Valuemustbegreaterthan0.

"media"

指定媒体固有的持续时间作为活动期间的最大值.这仅对定义媒体的元素有效.(对于精图的
动画元素,如果"media"被指定,此性质将被忽略.)Specifiesthemaximumvalueoftheactivedurationastheintrinsicmediaduration.Thisisonlyvalidforelementsthatdefinemedia.(ForSVG's

animationelements,if"media"isspecified,theattributewillbeignored.)

max无缺省值.此时完全不对活动期间进行限制.Thereisnodefaultvalueformax.Thisdoesnotconstraintheactivedurationatall.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'max'性质.Except
foranySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.Inparticular,
see
SMILAnimation:'max'attribute.restart:"always"|"whenNotActive"|"never"

always

动画可以在任何时间进行重启.Theanimationcanberestartedatanytime.

此时为缺省值.Thisisthedefaultvalue.

whenNotActive

动画仅当不活动时才可以重启(即.在活动结束之后).试图在动画播放期间重启动画将被忽略.Theanimationcanonlyberestartedwhenitisnotactive(i.e.aftertheactiveend).Attemptstorestarttheanimationduringitsactivedurationareignored.

never

元素不能在父时间容器的当前简单的持续时间的剩余部分内进行重启.(在精图的情况下,因为父时间容器是精图文档片段,故动画不能在文档持续时间的剩余部分内进行重启.)Theelementcannotberestartedfortheremainderofthecurrentsimpledurationoftheparenttimecontainer.(InthecaseofSVG,sincetheparenttimecontaineristheSVG
documentfragment,thentheanimationcannotberestartedfortheremainderofthedocumentduration.)

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'restart'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'restart'attribute.

repeatCount:numericvalue|"indefinite"

指定动画播放的次数.它可以有下列性质值:Specifiesthenumberofiterationsoftheanimationfunction.Itcanhavethefollowingattributevalues:

numericvalue

这是一种十进制"浮点"数值用于指定循环的次数.它可以包含用分数值表示的部分循环.一个分数值描述简单的持续时间的一部分.值必须大于0.Thisisa(base10)"floatingpoint"numericvaluethatspecifies
thenumberofiterations.Itcanincludepartialiterationsexpressedasfractionvalues.Afractionalvaluedescribesaportionofthe

simpleduration.Valuesmustbegreaterthan0.

"indefinite"

动画定义为可以无限次重复播放(即.直到文档结束).Theanimationisdefinedtorepeatindefinitely(i.e.untilthedocumentends).

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'repeatCount'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'repeatCount'attribute.

repeatDur:

Clock-value|"indefinite"

指定重复的整个持续时间.它可以有下列性质值:Specifiesthetotaldurationforrepeat.Itcanhavethefollowingattributevalues:

Clock-value

以表示时间指定持续时间来重复动画函数f(t).Specifiesthedurationin

presentationtimetorepeattheanimationfunctionf(t).

"indefinite"

动画定义为可以无限次重复播放(即.直到文档结束).Theanimationisdefinedtorepeatindefinitely(i.e.untilthedocumentends).

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'repeatDur'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'repeatDur'attribute.

fill:"freeze"|"remove"

这一性质可以取下列值:Thisattributecanhavethefollowingvalues:

freeze

动画效果F(t)被定义为冻结效果值在活动期间的最后值.在文档持续时间的剩余部分动画效果被"冻结"(或者直到动画被重启-参见

SMIL动画:重启动画).Theanimationeffect
F(t)isdefinedtofreezetheeffectvalueatthelastvalueoftheactiveduration.Theanimationeffectis"frozen"fortheremainderofthedocumentduration(oruntiltheanimationisrestarted-see

SMILAnimation:Restartinganimation).

remove

当动画的活动期间过去之后动画效果被去除(不再使用).在动画播放结束后,动画不再对目标发生影响(除非动画被重启-参见
SMIL动画:重启动画).Theanimationeffectisremoved(nolongerapplied)whentheactivedurationoftheanimationisover.Aftertheactiveendoftheanimation,theanimationnolongeraffectsthetarget(unlesstheanimationisrestarted-see

SMILAnimation:Restartinganimation).

Thisisthedefaultvalue.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'fill'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'fill'attribute.

SMIL动画[SMILANIM]规范定义了与上述性质相关的详细的处理规则.除了在此规范中被特别明显地说明的精图特定的规则外,上述这些性质的正式定义在SMIL动画[SMILANIM]
规范中.TheSMILAnimation[SMILANIM]specificationdefinesthedetailedprocessingrulesassociatedwiththeaboveattributes.ExceptforanySVG-specificrulesexplicitlymentioned
inthisspecification,theSMILAnimation[SMILANIM]specificationisthenormativedefinitionoftheprocessingrulesfortheaboveattributes.

Clockvalues
时钟值与SMIL动画[SMILANIM]中的语法相同,我们将其重复如下:ClockvalueshavethesamesyntaxasinSMILAnimation[SMILANIM],which
isrepeatedhere:


Clock-val::=Full-clock-val|Partial-clock-val

|Timecount-val

Full-clock-val::=Hours":"Minutes":"Seconds("."Fraction)?

Partial-clock-val::=Minutes":"Seconds("."Fraction)?

Timecount-val::=Timecount("."Fraction)?(Metric)?

Metric::="h"|"min"|"s"|"ms"

Hours::=DIGIT+;anypositivenumber

Minutes::=2DIGIT;rangefrom00to59

Seconds::=2DIGIT;rangefrom00to59

Fraction::=DIGIT+

Timecount::=DIGIT+

2DIGIT::=DIGITDIGIT

DIGIT::=[0-9]

对于时段值,缺省的度量后缀为"s"(秒).在时钟值中允许非嵌入的空白字符,尽管开始以及尾部的空白字符将被忽略.ForTimecountvalues,thedefaultmetricsuffixis"s"(forseconds).Noembeddedwhitespaceisallowedinclockvalues,althoughleadingandtrailingwhitespacecharacterswillbeignored.

时钟值在表示时间内描述.Clockvaluesdescribe

presentationtime.

下面是一些合法时钟值的例子:Thefollowingareexamplesoflegalclockvalues:

完全时钟值:Fullclockvalues:

02:30:03
=2hours,30minutesand3seconds

50:00:10.25
=50hours,10secondsand250milliseconds
部分时钟值:Partialclockvalue:

02:33
=2minutesand33seconds

00:10.5
=10.5seconds=10secondsand500milliseconds
时段时钟值:Timecountvalues:

3.2h
=3.2hours=3hoursand12minutes

45min
=45minutes

30s
=30seconds

5ms
=5milliseconds

12.467
=12secondsand467milliseconds

十进制的小数值正是以秒为单位进行定义的浮点数.于是:Fractionalvaluesarejust(base10)floatingpointdefinitionsofseconds.Thus:

00.5s=500milliseconds


00:00.005=5milliseconds


19.2.7定义时间方面动画值的性质Attributesthatdefineanimationvaluesovertime
下列性质对于元素
'animate',
'animateMotion',
'animateColor'和'animateTransform'而言是公共的.这些性质定义了赋值给时间方面的目标性质或属性.下列这些性质提供了在关键帧的相对时间以及不连续值之间的插补方法.Thefollowingattributes
arecommontoelements
'animate',
'animateMotion',
'animateColor'and
'animateTransform'.Theseattributesdefinethevaluesthatareassignedtothetargetattributeorpropertyovertime.Theattributesbelowprovidecontrolovertherelativetimingofkeyframesandtheinterpolationmethodbetweendiscretevalues.


<!ENTITY%animValueAttrs

"calcMode(discrete|linear|paced|spline)'linear'

valuesCDATA#IMPLIED

keyTimesCDATA#IMPLIED

keySplinesCDATA#IMPLIED

fromCDATA#IMPLIED

toCDATA#IMPLIED

byCDATA#IMPLIED">

性质定义:Attributedefinitions:

calcMode
="discrete|linear|paced|spline"

指定动画的插补模式.它可以取下列任何值之一.缺省模式为"linear",但是如果性质不支持线性插补(比如.对于字符串而言),此
calcMode
性质将被忽略而使用离散插补.Specifiestheinterpolationmodefortheanimation.Thiscantakeanyofthefollowingvalues.Thedefaultmodeis"linear",howeveriftheattribute
doesnotsupportlinearinterpolation(e.g.forstrings),the
calcMode
attributeisignoredanddiscreteinterpolationisused.

discrete


此时指定动画函数将不用任何插补从一个值跳到另一个值.Thisspecifiesthattheanimationfunctionwilljumpfromonevaluetothenextwithoutanyinterpolation.

linear


在值之间的简单线性插补用于计算动画函数.除了对
'animateMotion'外,此模式为缺省的
calcMode
.Simplelinearinterpolationbetweenvaluesisusedtocalculatetheanimationfunction.Exceptfor

'animateMotion',thisisthedefault
calcMode
.

paced


定义在动画播放期间产生匀速改变的插补.只有值定义在线性数值范围内,并且存在某种可以在两点之间计算的类似于"距离"的概念(例如.位置,宽度,高度,等等.)的性质值支持这种模式.如果指定"
paced
",任何
keyTimes
或
keySplines
将被忽略.对于
'animateMotion',这是它的缺省
calcMode
.Definesinterpolationtoproduceanevenpaceofchangeacrosstheanimation.Thisisonlysupportedforvaluesthatdefinealinearnumericrange,andforwhichsomenotionof"distance"betweenpointscan
becalculated(e.g.position,width,height,etc.).If"
paced
"isspecified,any
keyTimes
or
keySplines
willbeignored.For
'animateMotion',thisisthedefault
calcMode
.

spline


从取值列表中的一个值到另一个值之间按照由一个三次Bézier样条所定义的时间函数进行插补.此样条的点在
keyTimes
性质中定义,并且每个时间间隔的控制点在
keySplines
性质中定义.Interpolatesfromonevalueinthe
values
listtothenextaccordingtoatimefunctiondefinedbyacubicBézierspline.Thepointsofthesplinearedefinedinthe
keyTimes
attribute,andthecontrolpointsforeachintervalaredefinedinthe
keySplines
attribute.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'calcMode'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'calcMode'attribute.

values="<list>"

一个由分号分隔的一个或多个值的列表.支持
attributeType
范围的矢量语法的矢量值性质.除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'values'
性质.Asemicolon-separatedlistofoneormorevalues.Vector-valuedattributesaresupportedusingthevectorsyntaxofthe
attributeType
domain.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'values'attribute.

keyTimes
="<list>"

用来控制动画的步速的一个由分号分隔的时间值的列表.此列表中的每个时间值对应于
values
性质列表中的一个值,并且定义此值何时在动画函数中使用.在
keyTimes
列表中的每个时间值用0和1(包含)之间的一个浮点数来表示,代表动画元素持续时间的一个比例偏移量.Asemicolon-separatedlistoftimevaluesusedtocontrolthepacingoftheanimation.Each
timeinthelistcorrespondstoavalueinthe
values
attributelist,anddefineswhenthevalueisusedintheanimationfunction.Eachtimevalueinthe
keyTimes
listisspecifiedasafloatingpointvaluebetween0and1(inclusive),representingaproportionaloffsetintothesimpledurationoftheanimationelement.

如果指定了
keyTimes
的一个列表,那么在
keyTimes
列表中值的个数要与在
values
列表中值的个数完全相同.Ifalistof
keyTimes
isspecified,theremustbeexactlyasmanyvaluesinthe
keyTimes
listasinthe
values
list.

每个后续的时间值必须大于或等于以前的时间值.Eachsuccessivetimevaluemustbegreaterthanorequaltotheprecedingtimevalue.

keyTimes
列表的语义依赖于插补模式:The
keyTimes
listsemanticsdependsupontheinterpolationmode:

·对于线性和样条动画而言,列表中的第一个时间值必须为0,并且最后一个时间值必须为1.与每个值相联系的
keyTime
定义何时设置此值t;在
keyTimes
之间的值被插补.Forlinearandsplineanimation,thefirsttimevalueinthelistmustbe0,andthelasttimevalueinthelistmustbe1.The
keyTime
associatedwitheachvaluedefineswhenthevalueisset;valuesareinterpolatedbetweenthe
keyTimes
.

·对于离散动画而言,列表中的第一个时间值必须为0.与每个值相联系的时间定义何时设置此值;动画函数使用此值直到在
keyTimes
中定义的下一个时间来到时为止.Fordiscreteanimation,thefirsttimevalueinthelistmustbe0.Thetimeassociatedwitheachvaluedefineswhenthevalueisset;theanimationfunction
usesthatvalueuntilthenexttimedefinedin
keyTimes
.

如果插补模式为"paced",此时将忽略
keyTimes
性质.Iftheinterpolationmodeis"paced",the
keyTimes
attributeisignored.

如果在
keyTimes
说明中存在任何错误(不对的值,值的个数太多或太少),则文档片段是错误的(参见
错误处理).Ifthereareanyerrorsinthe
keyTimes
specification(badvalues,toomanyortoofewvalues),thedocumentfragmentisinerror(see

errorprocessing).

如果简单的持续时间是无限的,则忽略任何
keyTimes
说明.Ifthesimpledurationisindefinite,any
keyTimes
specificationwillbeignored.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'keyTimes'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'keyTimes'attribute.

keySplines
="<list>"

一套与
keyTimes
列表相关的Bézier控制点,它定义了一个控制时间间隔的步伐的三次Bézier样条函数.性质值是一个由分号分隔的控制点描述的列表.每个控制点描述为一组的四个值:
x1y1x2y2
,描述一段时间段的Bézier控制点.定义相关段的
keyTimes
值是Bézier"锚点",而
keySplines
值是控制点.于是,控制点的数目必须比
keyTimes
值的数目少.AsetofBéziercontrolpointsassociatedwiththe
keyTimes
list,definingacubicBézierfunctionthatcontrolsintervalpacing.Theattributevalueisasemicolonseparatedlistofcontrolpointdescriptions.Eachcontrolpointdescriptionisasetoffourvalues:
x1y1x2y2
,describingtheBéziercontrolpointsforonetimesegment.The
keyTimes
valuesthatdefinetheassociatedsegmentaretheBézier"anchorpoints",andthe
keySplines
valuesarethecontrolpoints.Thus,theremustbeonefewersetsofcontrolpointsthanthereare
keyTimes
.

值必须在0和1之间.Thevaluesmustallbeintherange0to1.

当
calcMode
不为"spline"时将忽略此性质.Thisattributeisignoredunlessthe
calcMode
issetto"spline".

如果在
keySplines
说明中存在任何错误(不对的值,值的个数太多或太少),则文档片段是错误的(参见
错误处理).Ifthereareanyerrorsinthe
keySplines
specification(badvalues,toomanyortoofewvalues),thedocumentfragmentisinerror(see

errorprocessing).

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'keySplines'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'keySplines'attribute.

from="<value>"

指定动画的开始值.Specifiesthestartingvalueoftheanimation.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'from'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'from'attribute.

to="<value>"

指定动画的终止值.Specifiestheendingvalueoftheanimation.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'to'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'to'attribute.

by="<value>"

指定动画的相对偏移量值.Specifiesarelativeoffsetvaluefortheanimation.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'by'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'by'attribute.

SMIL动画[SMILANIM]规范定义了与上述性质相关的详细的处理规则.除了在此规范中被特别明显地说明的精图特定的规则外,上述这些性质的正式定义在SMIL动画[SMILANIM]
规范中.TheSMILAnimation[SMILANIM]specificationdefinesthedetailedprocessingrulesassociatedwiththeaboveattributes.ExceptforanySVG-specificrulesexplicitly
mentionedinthisspecification,theSMILAnimation[SMILANIM]specificationisthenormativedefinitionoftheprocessingrulesfortheaboveattributes.

在动画元素中指定的动画值必须是指定性质的合法值.开头的或尾部的空白符以及在分号之前或之后的空白符都会被忽略.Theanimationvaluesspecifiedintheanimationelementmustbelegalvaluesforthespecifiedattribute.Leadingandtrailingwhitespace,andwhitespacebeforeandaftersemicolonseparators,will
beignored.

为指定的性质(当在相关的命名空间中定义)所指定的所有值必须是合法的.如果有不合法的值,则文档片段是错误的(参见
错误处理).Allvaluesspecifiedmustbelegalvaluesforthespecifiedattribute(asdefinedintheassociatednamespace).Ifanyvaluesarenotlegal,thedocumentfragmentisinerror(see

errorprocessing).

如果使用值的列表,动画将进行动画的过程中按照顺序使用这些值.如果指定值的列表,则任何from,to和
by性质将被忽略.Ifalistofvaluesisused,theanimationwillapplythevaluesinorderoverthecourseoftheanimation.Ifalistof
valuesisspecified,anyfrom,toandbyattributevaluesareignored.

关于动画变量from/by/to的处理规则在
动画函数值中进行描述.Theprocessingrulesforthevariantsoffrom/by/toanimationsaredescribedin

Animationfunctionvalues.

下列图解解释了
keySplines
性质的插补.每个图表解释了单一时间间隔(即在
keyTimes
和
values
列表的相联系的对偶值之间.)的设置的效果.水平轴可以看作是关于在时间间隔内插补的单位步进的输入值-即沿着给定时间间隔进行插补的步速.垂直轴是单位步进的结果值,通过
keySplines
函数的计算来产生.另一个描述方法是水平轴为时间间隔的输入单位时间,
而垂直轴则是输出的单位时间.也可以参见章节
时间间隔和实时钟时间.Thefollowingfigureillustratestheinterpretationofthe
keySplines
attribute.Eachdiagramillustratestheeffectof
keySplines
settingsforasingleinterval(i.e.betweentheassociatedpairsofvaluesinthe
keyTimes
and
values
lists.).Thehorizontalaxiscanbethoughtofastheinputvalueforthe
unitprogressofinterpolationwithintheinterval-i.e.thepacewithwhichinterpolationproceedsalongthegiveninterval.Theverticalaxisistheresultingvalueforthe
unitprogress,yieldedbythe
keySplines
function.Anotherwayofdescribingthisisthatthehorizontalaxisistheinput
unittimefortheinterval,andtheverticalaxisistheoutputunittime.Seealsothesection

Timingandreal-worldclocktimes.

keySplines="0011"(thedefault)

keySplines=".50.51"

keySplines="0.75.251"

keySplines="10.25.25"

ExamplesofkeySplines
为了解释此计算,考虑简单的例子:Toillustratethecalculations,considerthesimpleexample:


<animatedur="4s"values="10;20"keyTimes="0;1"

calcMode="spline"keySplines={asintable}/>

上述四种情况所使用的keySplines值,作为动画进行的近似的插补值为:UsingthekeySplinesvaluesforeachofthefourcasesabove,theapproximateinterpolatedvaluesastheanimationproceedsare:

keySplinesvalues

Initialvalue

After1s

After2s

After3s

Finalvalue

0011

10.0

12.5

15.0

17.5

20.0

.50.51

10.0

11.0

15.0

19.0

20.0

0.75.251

10.0

18.0

19.3

19.8

20.0

10.25.25

10.0

10.1

10.6

16.9

20.0

关于Bézier样条计算的正式定义,参见[FOLEY-VANDAM].ForaformaldefinitionofBéziersplinecalculation,see[FOLEY-VANDAM].

19.2.8控制动画是否为叠加的性质Attributesthatcontrolwhetheranimationsareadditive
用偏移值或增量值而不用绝对值来定义动画的某个性质的值常常是有用的.一个简单的"生长"动画可以通过将对象的宽度增加10像素来实现:Itisfrequentlyusefultodefineanimationasanoffsetordeltatoanattribute'svalue,ratherthanasabsolutevalues.Asimple"grow"animationcanincreasethewidthofanobject
by10pixels:


<rectwidth="20px"...>

<animateattributeName="width"from="0px"to="10px"dur="10s"

additive="sum"/>

</rect>

在以前的结果的基础上进行重复,累加每次循环的结果常常是有用的.下列例子产生一个在每次循环中不断增长的矩形:Itisfrequentlyusefulforrepeatedanimationstobuilduponthepreviousresults,accumulatingwitheachinteration.Thefollowingexamplecausestherectangletocontinuetogrowwitheachrepeat
oftheanimation:


<rectwidth="20px"...>

<animateattributeName="width"from="0px"to="10px"dur="10s"

additive="sum"accumulate="sum"repeatCount="5"/>

</rect>

在第一次循环结束时矩形的宽度为30像素.在第二次循环结束时矩形的宽度为40像素.在第五次循环结束时矩形的宽度为70像素.Attheendofthefirstrepetition,therectanglehasawidthof30pixels.Attheendofthesecondrepetition,therectanglehasawidthof40pixels.Attheendofthefifthrepetition,
therectanglehasawidthof70pixels.

关于累加动画的更多信息,请参见
SMIL动画:累加动画.关于累加动画的更多信息,请参见
SMIL动画:控制重复动画的行为-累积动画.Formoreinformationaboutadditiveanimations,see

SMILAnimation:Additiveanimation.Formoreinformationoncumulativeanimations,see

SMILAnimation:Controllingbehaviorofrepeatinganimation-Cumulativeanimation.

对于元素
'animate',
'animateMotion',
'animateColor'和'animateTransform'来说下列性质是共同的.Thefollowingattributesarecommontoelements'animate',

'animateMotion',
'animateColor'and
'animateTransform'.


<!ENTITY%animAdditionAttrs

"additive(replace|sum)'replace'

accumulate(none|sum)'none'">

性质定义:Attributedefinitions:

additive="replace|sum"

控制动画是否叠加.Controlswhetherornottheanimationisadditive.

sum

指定此动画将叠加到性质垫底的值和其它较低优先级的动画上.Specifiesthattheanimationwilladdtotheunderlyingvalueoftheattributeandotherlowerpriorityanimations.

replace

指定此动画将覆盖性质垫底的值和其它较低优先级的动画上.此为缺省值,可是其行为也会受到在
SMIL动画:from,to和by性质如何影响累加行为中描述的性质
by
和
to
的动画值的影响.Specifiesthattheanimationwilloverridetheunderlyingvalueoftheattributeandotherlowerpriorityanimations.Thisisthedefault,however
thebehaviorisalsoaffectedbytheanimationvalueattributes
by
and
to
,asdescribedin
SMILAnimation:Howfrom,toandbyattributesaffectadditivebehavior.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'additive'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'additive'attribute.

accumulate="none|sum"

控制动画是否为累积的.Controlswhetherornottheanimationiscumulative.

sum

指定在第一个之后的每一个重复循环依赖以前循环的最后值.Specifiesthateachrepeatiterationafterthefirstbuildsuponthelastvalueofthepreviousiteration.

none

指定重复循环不累加.Thisisthedefault.Specifiesthatrepeatiterationsarenotcumulative.Thisisthedefault.

当目标性质值不支持加法或者动画元素不重复时,此性质被忽略.Thisattributeisignoredifthetargetattributevaluedoesnotsupportaddition,oriftheanimationelementdoesnotrepeat.

对于"toanimation"累加动画不被定义.Cumulativeanimationisnotdefinedfor"toanimation".

如果动画函数仅由
to
性质指定时此性质被忽略.Thisattributewillbeignorediftheanimationfunctionisspecifiedwithonlythe
to
attribute.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'accumulate'
性质.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthisattributeistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'accumulate'attribute.

19.2.9Inheritance
精图允许对性质和属性进行动画.如果一给定的性质或属性被后代所继承,那么在父元素比如
'g'元素上的动画具有传播的效果即性质或属性动画值会传给后代元素使其相应的性质或属性具有动画效果;于是,后代元素可以从其祖先处继承动画性质和属性.SVGallowsbothattributesandpropertiestobeanimated.Ifagivenattributeorpropertyisinheritablebydescendants,thenanimationsonaparentelementsuchasa

'g'elementhastheeffectofpropagatingtheattributeorpropertyanimationvaluestodescendantelementsastheanimationproceeds;thus,descendantelementscaninheritanimatedattributesandpropertiesfromtheirancestors.

19.2.10'animate'元素The'animate'element
'animate'元素用来对一个单一的性质或属性随时间进行动画.例如,为了在5秒内重复地将一个矩形淡出,你可以指定:The'animate'elementisusedtoanimateasingleattributeorpropertyovertime.Forexample,tomakearectanglerepeatedlyfadeawayover5seconds,youcanspecify:


<rect>

<animateattributeType="CSS"attributeName="opacity"

from="1"to="0"dur="5s"repeatCount="indefinite"/>

</rect>

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'animate'
元素.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthiselementistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'animate'element.


<!ENTITY%animateExt"">

<!ELEMENTanimate(%descTitleMetadata;%animateExt;)>

<!ATTLISTanimate

%stdAttrs;

%testAttrs;

externalResourcesRequired%Boolean;#IMPLIED

%animationEvents;

%animElementAttrs;

%animAttributeAttrs;

%animTimingAttrs;

%animValueAttrs;

%animAdditionAttrs;>

在别处定义的性质:Attributesdefinedelsewhere:

%stdAttrs;,%testAttrs;,

externalResourcesRequired,%animationEvents;,%animElementAttrs;,%animAttributeAttrs;,%animTimingAttrs;,%animValueAttrs;,%animAdditionAttrs;.

关于可以使用'animate'元素进行动画的性质和属性的列表,参见
能够进行动画的元素,性质和属性.Foralistofattributesandpropertiesthatcanbeanimatedusingthe'animate'element,see

Elements,attributesandpropertiesthatcanbeanimated.

19.2.11'set'元素The'set'element
'set'元素提供在特定持续时间内正好设置一个性质的值的一种简单方法.它支持所有性质类型,包括那些绝对不能进行插补的性质,比如字符串和布尔值.'set'元素是不能叠加的.不允许叠加和累积的性质,并且即使指定这种类型的性质也会被忽略掉.The'set'elementprovidesasimplemeansofjustsettingthevalueofanattributeforaspecifiedduration.Itsupportsallattribute
types,includingthosethatcannotreasonablybeinterpolated,suchasstringandbooleanvalues.The'set'elementisnon-additive.Theadditiveandaccumulateattributesarenotallowed,andwillbeignoredifspecified.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'set'
元素.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthiselementistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'set'element.


<!ENTITY%setExt"">

<!ELEMENTset(%descTitleMetadata;%setExt;)>

<!ATTLISTset

%stdAttrs;

%testAttrs;

externalResourcesRequired%Boolean;#IMPLIED

%animationEvents;

%animElementAttrs;

%animAttributeAttrs;

%animTimingAttrs;

toCDATA#IMPLIED>

性质定义:Attributedefinitions:

to="<value>"

指定在'set'元素的持续时间内此性质的值.参数值必须与性质类型相匹配.Specifiesthevaluefortheattributeduringthedurationofthe'set'element.Theargumentvaluemustmatchtheattributetype.

在别处定义的性质:Attributesdefinedelsewhere:

%stdAttrs;,%testAttrs;,

externalResourcesRequired,%animationEvents;,%animElementAttrs;,%animAttributeAttrs;,%animTimingAttrs;.

关于可以使用'set'元素进行动画的性质和属性的列表,参见
能够进行动画的元素,性质和属性.Foralistofattributesandpropertiesthatcanbeanimatedusingthe'set'element,see

Elements,attributesandpropertiesthatcanbeanimated.

19.2.12'animateMotion'元素The'animateMotion'element
'animateMotion'元素使一个引用元素沿着一条移动路径移动.The'animateMotion'elementcausesareferencedelementtomovealongamotionpath.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'animateMotion'
元素.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthiselementistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'animateMotion'element.


<!ENTITY%animateMotionExt"">

<!ELEMENTanimateMotion(%descTitleMetadata;,mpath?%animateMotionExt;)>

<!ATTLISTanimateMotion

%stdAttrs;

%testAttrs;

externalResourcesRequired%Boolean;#IMPLIED

%animationEvents;

%animElementAttrs;

%animTimingAttrs;

calcMode(discrete|linear|paced|spline)'paced'

valuesCDATA#IMPLIED

keyTimesCDATA#IMPLIED

keySplinesCDATA#IMPLIED

fromCDATA#IMPLIED

toCDATA#IMPLIED

byCDATA#IMPLIED

%animAdditionAttrs;

pathCDATA#IMPLIED

keyPointsCDATA#IMPLIED

rotateCDATA#IMPLIED

originCDATA#IMPLIED>

性质定义:Attributedefinitions:

calcMode
="discrete|linear|paced|spline"

指定动画的插补模式.参见上述
calcMode性质的一般描述.唯一的不同是'animateMotion'的calcMode的缺省值为paced.参见
SMIL动画:'animateMotion'的'calcMode'性质.Specifiestheinterpolationmodefortheanimation.Refertogeneraldescriptionofthe

calcModeattributeabove.TheonlydifferenceisthatthedefaultvalueforthecalcModefor'animateMotion'ispaced.See

SMILAnimation:'calcMode'attributefor'animateMotion'.

path="<path-data>"

移动路径,与
'path'元素的d=性质以相同的格式表示并且以相同的方式进行解释.沿着移动路径移动的动画效果是将一个附加的变换矩阵加到引用对象的CTM上通过随时计算X和Y的值这样便会生成沿着当前用户坐标系的x-和y-轴的平移.Themotionpath,expressed
inthesameformatandinterpretedthesamewayasthe
d=attributeonthe
'path'element.TheeffectofamotionpathanimationistoaddasupplementaltransformationmatrixontotheCTMforthereferencedobjectwhichcausesatranslationalongthex-andy-axesofthecurrentusercoordinatesystembythecomputedXandYvalues
computedovertime.
keyPoints="<list-of-numbers>"
keyPoints接受用分号分隔的取值介于0和1之间浮点数列表并且表示在由对应的keyTimes值所指定的时间的瞬间此对象沿着移动路径移动了多远.距离的计算使用用户代理的

沿着路径的距离算法.在列表中每个前进值对应
keyTimes
性质列表中的一个值.keyPointstakesasemicolon-separatedlistoffloatingpointvaluesbetween0and1andindicateshowfaralongthemotionpaththeobjectshallmoveatthemomentintimespecifiedbycorrespondingkeyTimes
value.Distancecalculationsusetheuseragent's
distancealongthepathalgorithm.Eachprogressvalueinthelistcorrespondstoavalueinthe
keyTimes
attributelist.

如果指定了列表
keyPoints
,那么在
keyPoints
列表中值的个数必须与
keyTimes
列表中值的个数相同.Ifalistof
keyPoints
isspecified,theremustbeexactlyasmanyvaluesinthe
keyPoints
listasinthe
keyTimes
list.

如果在
keyPoints
说明中存在任何错误(不对的值,值的个数太多或太少),则文档片段是错误的(参见
错误处理).Ifthereareanyerrorsinthe
keyPoints
specification(badvalues,toomanyortoofewvalues),thenthedocumentisinerror(see

Errorprocessing).

rotate="<angle>|auto|auto-reverse"

auto表示对象根据移动路径的方向(即,切向量方向)的角度随着时间进行旋转.auto-reverse表示对象根据移动路径的方向(即,切向量方向)的角度加上180度随着时间进行旋转.也可以给定一个实际的角度值,它表示相对于当前用户坐标系的x轴的角度.rotate性质将一个额外的变换矩阵加到CTM中来实现对当前用户坐标系的原点的旋转变换.旋转变换在由

path性质所进行计算的平移变换之后进行.缺省值为0.autoindicatesthattheobjectisrotatedovertimebytheangleofthedirection(i.e.,directionaltangentvector)ofthemotionpath.auto-reverseindicatesthattheobjectisrotatedovertimebytheangleofthedirection(i.e.,
directionaltangentvector)ofthemotionpathplus180degrees.Anactualanglevaluecanalsobegiven,whichrepresentsananglerelativetothex-axisofcurrentusercoordinatesystem.Therotateattributeaddsasupplementaltransformationmatrixontothe
CTMtoapplyarotationtransformationabouttheoriginofthecurrentusercoordinatesystem.Therotationtransformationisappliedafterthesupplementaltranslationtransformationthatiscomputedduetothe

pathattribute.Thedefaultvalueis0.

origin="default"

origin性质在SMIL动画规范[SMILANIM-ATTR-ORIGIN]中定义.在精图中它不起作用.TheoriginattributeisdefinedintheSMILAnimationspecification[SMILANIM-ATTR-ORIGIN].It
hasnoeffectinSVG.

在别处定义的性质:Attributesdefinedelsewhere:

%stdAttrs;,%testAttrs;,

externalResourcesRequired,%animationEvents;,%animElementAttrs;,%animTimingAttrs;,values,keyTimes,keySplines,from,

to,
by,
%animAdditionAttrs;.


<!ENTITY%mpathExt"">

<!ELEMENTmpath(%descTitleMetadata;%mpathExt;)>

<!ATTLISTmpath

%stdAttrs;

%xlinkRefAttrs;

xlink:href%URI;#REQUIRED

externalResourcesRequired%Boolean;#IMPLIED>

性质定义:Attributedefinitions:

xlink:href="<uri>"

A
URIreferencetothe
'path'elementwhichdefinesthemotionpath.

Animatable:no.

在别处定义的性质:Attributesdefinedelsewhere:

%stdAttrs;,,%xlinkRefAttrs;externalResourcesRequired.

对于'animateMotion',
from,
by,
to和
values所指定的值由x,y坐标值偶构成,x坐标和y坐标之间用逗号或空白符分隔.例如,from="33,15"指定x坐标值为33而y坐标值为15.For'animateMotion',thespecifiedvaluesfor

from,
by,
toand
valuesconsistsofx,ycoordinatepairs,withasinglecommaand/orwhitespaceseparatingthexcoordinatefromtheycoordinate.Forexample,from="33,15"specifiesanxcoordinatevalueof33andaycoordinatevalueof15.

如果提供
values性质它必须由x,y坐标偶的列表所组成.坐标值之间用至少一个空白符或一个逗号分隔.分隔符周围多余的空白符是允许的.例如,values="10,20;30,20;30,40"或values="10mm,20mm;30mm,20mm;30mm,40mm".每个坐标表示一

长度.性质
from,
by,
to和
values指定当前画布上的一个表示移动路径的形状.Ifprovided,the
valuesattributemustconsistsofalistofx,ycoordinatepairs.Coordinatevaluesareseparatedbyatleastonewhitespacecharacteroracomma.Additionalwhitespacearoundtheseparatorisallowed.Forexample,values="10,20;30,20;30,40"orvalues="10mm,20mm;30mm,20mm;30mm,40mm".Each
coordinaterepresentsa
length.Attributes
from,
by,
toand
valuesspecifyashapeonthecurrentcanvaswhichrepresentsthemotionpath.

可用两种通过使用精图的路径数据命令来定义移动路径的可供选择的方法:TwooptionsareavailablewhichallowdefinitionofamotionpathusinganyofSVG's

pathdatacommands:

path性质通过使用精图的路径数据命令直接在'animateMotion'上定义一个移动路径.
the
pathattributedefinesamotionpathdirectlyon
'animateMotion'elementusinganyofSVG's
pathdatacommands.

'mpath'子元素提供一种引用一个外部'path'元素作为移动路径的定义的能力.the

'mpath'sub-elementprovidestheabilitytoreferenceanexternal
'path'elementasthedefinitionofthemotionpath.

注意精图的路径数据命令只能包含用户空间的值,而

from,
by,
to和
values既可在用户空间中指定坐标也可以使用单位标识符.参见
单位.NotethatSVG's
pathdatacommandscanonlycontainvaluesinuserspace,whereas
from,
by,
toand
valuescanspecifycoordinatesinuserspaceorusingunitidentifiers.See
Units.

形状的各种(x,y)点为引用的对象提供了一个附加的变换矩阵到CTM上它通过随时计算形状的(x,y)值生成一个沿着当前用户坐标系的x-和y-轴所进行的平移.于是,引用对象通过相对于当前用户坐标系的原点的偏移量随时进行平移.此附加变换被用在任何由于目标元素的
transform性质或者任何在此性质上的动画由于在目标元素上的'animateTransform'元素所生成的变换的顶部.???Thevarious(x,y)pointsoftheshapeprovideasupplementaltransformationmatrixontotheCTMforthereferencedobjectwhichcausesatranslationalongthex-andy-axesofthecurrentusercoordinatesystembythe(x,y)valuesoftheshapecomputedovertime.Thus,thereferencedobjectistranslatedovertimebythe
offsetofthemotionpathrelativetotheoriginofthecurrentusercoordinatesystem.Thesupplementaltransformationisappliedontopofanytransformationsduetothetargetelement's
transformattributeoranyanimationsonthatattributedueto
'animateTransform'elementsonthetargetelement.

additive和accumulate
性质用于'animateMotion'元素.都同时引用一个相同的目标元素的多个'animateMotion'元素可以相互叠加;可是,从'animateMotion'元素所导致的变换总是追加到目标元素的
transform性质或者'animateTransform'元素所导致的变换上.The

additiveand
accumulateattributesapplytoelements.Multiple'animateMotion'elementsallsimultaneouslyreferencingthesametargetelementcanbeadditivewithrespecttoeachother;however,thetransformationswhichresultfromthe'animateMotion'elementsarealways
supplementaltoanytransformationsduetothetargetelement'stransformattributeorany
'animateTransform'elements.

animateMotion的缺省计算模式(calcMode)是"paced".这会产生沿着指定的路径的匀速运动.注意animateMotion元素可以叠加时,注意到两个或更多"paced"(匀速)动画的叠加也许不能生成一个匀速的组合的运动动画是重要的.Thedefaultcalculationmode(calcMode)foranimateMotionis"paced".Thiswillproduceconstantvelocitymotion
alongthespecifiedpath.NotethatwhileanimateMotionelementscanbeadditive,itisimportanttoobservethattheadditionoftwoormore"paced"(constantvelocity)animationsmightnotresultinacombinedmotionanimationwithconstantvelocity.

当path与"discrete","linear"或"spline"calcMode设置相结合时,并且如果不提供性质keyPoints,值的数目由此路径的点的数目来定义,除非在此路径中有一个"moveto"命令.在此path中的"moveto"命令(即除了此path描述的开始)一个"moveto"命令不算作一个追加的点当划分持续时间时,或者当与
keyTimes
,
keySplines
和
keyPoints
的值相联系时.当path与一个"paced"calcMode设置相结合时,所有"moveto"命令被认为具有长度0(即它们是在瞬间发生的),并且在计算进步时不加考虑.Whenapathiscombinedwith"discrete","linear"or"spline"calcModesettings,andif
attributekeyPointsisnotprovided,thenumberofvaluesisdefinedtobethenumberofpointsdefinedbythepath,unlessthereare"moveto"commandswithinthepath.A"moveto"commandwithinthepath(i.e.otherthanatthebeginningofthepathdescription)A
"moveto"commanddoesnotcountasanadditionalpointwhendividinguptheduration,orwhenassociating
keyTimes
,
keySplines
and
keyPoints
values.Whenapathiscombinedwitha"paced"calcModesetting,all"moveto"commandsareconsideredtohave0length(i.e.theyalwayshappeninstantaneously),andisnotconsideredincomputingthepacing.

为了在控制沿着移动路径的速度时较灵活,keyPoints性质提供了为每个keyTimes指定值指定沿着移动路径的进步的能力.如果指定了,keyPoints使得
keyTimes使用keyPoints中的值而不是在values性质数组中指定的值也不是path性质中的点.Formoreflexibilityincontrollingthevelocityalongthemotionpath,the
keyPointsattributeprovidestheabilitytospecifytheprogressalongthemotionpathforeachofthe
keyTimesspecifiedvalues.Ifspecified,keyPointscauseskeyTimestoapplytothevaluesinkeyPointsratherthanthepointsspecifiedinthevaluesattributearrayorthepointsonthepathattribute.

关于'animateMotion'的覆盖规则说明如下.注意移动路径的定义,
'mpath'元素覆盖path性质,而path覆盖values,而values覆盖from/by/to.注意对应于keyTimes性质的点的确定,keyPoints性质覆盖path,而path覆盖values,而values覆盖from/by/to.Theoverriderulesfor'animateMotionareasfollows.Regardingthedefinitionofthemotionpath,the

'mpath'elementoverridesthethepathattribute,whichoverridesvalues,whichoverridesfrom/by/to.RegardingdeterminingthepointswhichcorrespondtothekeyTimesattributes,thekeyPointsattributeoverridespath,whichoverridesvalues,whichoverrides
from/by/to.

在持续时间dur的一个移动路径动画的任何时间t,沿着移动路径计算的坐标(x,y)是由找到的点(x,y)确定的它是由
t/dur使用用户代理的
沿着路径的距离算法求出的沿着移动路径的距离.???Atanytimetwithinamotionpathanimationofduration
dur,thecomputedcoordinate(x,y)alongthemotionpathisdeterminedbyfindingthepoint(x,y)whichis
t/durdistancealongthemotionpathusingtheuseragent's
distancealongthepathalgorithm.

下列例子说明在一个移动路径动画期间额外的变换矩阵被计算.Thefollowingexampledemonstratesthesupplementaltransformationmatricesthatarecomputedduringamotionpathanimation.

ExampleanimMotion01显示一个沿一个移动路径运动的三角形.ExampleanimMotion01showsatrianglemovingalongamotionpath.


<?xmlversion="1.0"standalone="no"?>

<!DOCTYPEsvgPUBLIC"-//W3C//DTDSVG20010904//EN"

"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

<svgwidth="5cm"height="3cm"viewBox="00500300"

xmlns="http://www.w3.org/2000/svg">

<desc>ExampleanimMotion01-demonstratemotionanimationcomputations</desc>

<rectx="1"y="1"width="498"height="298"

fill="none"stroke="blue"stroke-width="2"/>


<!--Drawtheoutlineofthemotionpathinblue,along

withthreesmallcirclesatthestart,middleandend.-->

<pathd="M100,250C100,50400,50400,250"

fill="none"stroke="blue"stroke-width="7.06"/>

<circlecx="100"cy="250"r="17.64"fill="blue"/>

<circlecx="250"cy="100"r="17.64"fill="blue"/>

<circlecx="400"cy="250"r="17.64"fill="blue"/>


<!--Hereisatrianglewhichwillbemovedaboutthemotionpath.

Itisdefinedwithanuprightorientationwiththebaseof

thetrianglecenteredhorizontallyjustabovetheorigin.-->

<pathd="M-25,-12.5L25,-12.5L0,-87.5z"

fill="yellow"stroke="red"stroke-width="7.06">


<!--Definethemotionpathanimation-->

<animateMotiondur="6s"repeatCount="indefinite"

path="M100,250C100,50400,50400,250"rotate="auto"/>

</path>

</svg>

Atzeroseconds

Atthreeseconds

Atsixseconds

ExampleanimMotion01
ViewthisexampleasSVG(SVG-enabledbrowsersonly)

下列表格显示使用额外的变换矩阵达到移动路径动画的效果.Thefollowingtableshowsthesupplementaltransformationmatricesthatareappliedtoachievetheeffectofthemotionpathanimation.

After0s

After3s

After6s

Supplementaltransform

duetomovement

alongmotionpath

translate(100,250)

translate(250,100)

translate(400,250)

Supplementaltransform

dueto

rotate="auto"

rotate(-90)

rotate(0)

rotate(90)

关于可用'animateMotion'元素进行动画的元素的列表,请参见
可以进行动画的元素,性质和属性.Foralistofelementsthatcanbeanimatedusingthe'animateMotion'element,see

Elements,attributesandpropertiesthatcanbeanimated.

19.2.13'animateColor'元素The'animateColor'element
'animateColor'元素指定一种随时间的颜色变化.The'animateColor'elementspecifiesacolortransformationovertime.

除了在此规范中被特别明显地说明的精图特定的规则外,这一性质的正式定义在SMIL动画[SMILANIM]规范中.特别,参见SMIL动画:'animateColor'
元素.ExceptforanySVG-specificrulesexplicitlymentionedinthisspecification,thenormativedefinitionforthiselementistheSMILAnimation[SMILANIM]specification.
Inparticular,see
SMILAnimation:'animateColor'element.


<!ENTITY%animateColorExt"">

<!ELEMENTanimateColor(%descTitleMetadata;%animateColorExt;)>

<!ATTLISTanimateColor

%stdAttrs;

%testAttrs;

externalResourcesRequired%Boolean;#IMPLIED

%animationEvents;

%animElementAttrs;

%animAttributeAttrs;

%animTimingAttrs;

%animValueAttrs;

%animAdditionAttrs;>

在别处定义的性质:Attributesdefinedelsewhere:

%stdAttrs;,%testAttrs;,

externalResourcesRequired,%animationEvents;,%animElementAttrs;,%animAttributeAttrs;,%animTimingAttrs;,%animValueAttrs;,%animAdditionAttrs;.

from,
by和
to性质取颜色值,这里每个颜色值用下列语法表示(与精图中可以取颜色值的属性所用的语法相同):The
from,
byand
toattributestakecolorvalues,whereeachcolorvalueisexpressedusingthefollowingsyntax(thesamesyntaxasusedinSVG'spropertiesthatcantakecolorvalues):

<color>[icc-color(<name>[,<icccolorvalue>]*)]

'animateColor'元素的
values性质由用分号分隔的颜色值列表构成,此列表中的每个颜色值用上述语法表示.The
valuesattributeforthe'animateColor'elementconsistsofasemicolon-separatedlistofcolorvalues,witheachcolorvalueexpressedintheabovesyntax.

可以提供超出范围的颜色值,可是用户代理的处理将会依赖于特定的实现.用户代理尽可能在最后钳制颜色值为允许的颜色值,可是注意到系统的差别也许会导致不同的系统的不一致的行为.Outofrangecolorvaluescanbeprovided,butuseragentprocessingwillbeimplementationdependent.Useragentsshouldclampcolorvaluestoallowcolorrangevalues
aslateaspossible,butnotethatsystemdifferencesmightprecludeconsistentbehavioracrossdifferentsystems.

'color-interpolation'属性用于结果来自'animateColor'动画的颜色插补.The

'color-interpolation'propertyappliestocolorinterpolationsthatresultfrom'animateColor'animations.

关于可用'animateColor'元素进行动画的性质和属性的列表,请参见
可以进行动画的元素,性质和属性.Foralistofattributesandpropertiesthatcanbeanimatedusingthe'animateColor'element,see

Elements,attributesandpropertiesthatcanbeanimated.

19.2.14'animateTransform'元素The'animateTransform'element
'animateTransform'元素对目标元素的一个变换性质进行动画,因此允许动画控制平移,缩放,旋转以及歪斜.The'animateTransform'elementanimatesatransformationattributeonatargetelement,therebyallowinganimationstocontroltranslation,scaling,rotationand/orskewing.


<!ENTITY%animateTransformExt"">

<!ELEMENTanimateTransform(%descTitleMetadata;%animateTransformExt;)>

<!ATTLISTanimateTransform

%stdAttrs;

%testAttrs;

externalResourcesRequired%Boolean;#IMPLIED

%animationEvents;

%animElementAttrs;

%animAttributeAttrs;

%animTimingAttrs;

%animValueAttrs;

%animAdditionAttrs;

type(translate|scale|rotate|skewX|skewY)"translate">

性质定义:Attributedefinitions:

type="translate|scale|rotate|skewX|skewY"

表示值随时间变化的变换的类型.Indicatesthetypeoftransformationwhichistohaveitsvalueschangeovertime.

在别处定义的性质:Attributesdefinedelsewhere:

%stdAttrs;,%testAttrs;,

externalResourcesRequired,%animationEvents;,%animElementAttrs;,%animAttributeAttrs;,%animTimingAttrs;,%animValueAttrs;,%animAdditionAttrs;.

from,
by和
to性质取为给定变换类型可用的相同语法表示的值:The
from,
byand
toattributestakeavalueexpressedusingthesamesyntaxthatisavailableforthegiventransformationtype:

对于type="translate",每个单独的值表示为<tx>[,<ty>].Foratype="translate",eachindividualvalueisexpressedas<tx>[,<ty>].

对于type="scale",每个单独的值表示为<sx>[,<sy>].Foratype="scale",eachindividualvalueisexpressedas<sx>[,<sy>].

对于type="rotate",每个单独的值表示为<rotate-angle>[<cx><cy>].Foratype="rotate",eachindividualvalueisexpressedas<rotate-angle>[<cx><cy>].

对于type="skewX"和type="skewY",每个单独的值表示为<skew-angle>.Foratype="skewX"andtype="skewY",eachindividualvalueisexpressedas<skew-angle>.

(参见transform
性质.)(SeeThetransformattribute.)

'animateTransform'元素的
values性质由一个分号分隔的值的列表组成,这里每个单独的值以上述from,

by和
to所描述的方式来表示.The
valuesattributeforthe'animateTransform'elementconsistsofasemicolon-separatedlistofvalues,whereeachindividualvalueisexpressedasdescribedabovefor

from,
byand
to.

如果
calcMode的值为paced,那么变换的每个部份的整个被计算的"距离"(例如,对于一个平移操作,关于tx和ty的整个被计算的距离)由每个值偶之间的差的绝对值的和所组成,并且动画播放时为每个单独的部分产生一个等距的运动.???If

calcModehasthevaluepaced,thenatotal"distance"foreachcomponentofthetransformationiscalculated(e.g.,foratranslateoperation,atotaldistanceiscalculatedforboth
txandty)consistingofthesumoftheabsolutevaluesofthedifferencesbetweeneachpairofvalues,andtheanimationrunstoproduceaconstantdistancemovementforeachindividualcomponent.

当一个动画活动时,非叠加(即,additive="replace")'animateTransform'的效果为用由'animateTransform'定义的变换所得出的值替换给定的性质的值.叠加(即,additive="sum")的效果为后乘以由这一'animateTransform'定义的变换所对应的变换矩阵.为了说明:Whenananimationisactive,theeffectofnon-additive'animateTransform'(i.e.,
additive="replace")istoreplacethegivenattribute'svaluewiththetransformationdefinedbythe'animateTransform'.Theeffectofadditive(i.e.,additive="sum")istopost-multiplythetransformationmatrixcorrespondingtothetransformationdefinedby
this'animateTransform'.Toillustrate:


<recttransform="skewX(30)"...>

<animateTransformattributeName="transform"attributeType="XML"

type="rotate"from="0"to="90"dur="5s"

additive="replace"fill="freeze"/>

<animateTransformattributeName="transform"attributeType="XML"

type="scale"from="1"to="2"dur="5s"

additive="replace"fill="freeze"/>

</rect>

在上面一小段代码中,因为两个动画都具有性质additive="replace",第一个动画覆盖矩形本身的变换而第二个动画又覆盖第一个动画的变换;因此,在时间为5秒的时候,上述两个动画的视觉结果等价于下列静止的矩形:Inthecodesnippetabove,becausethebothanimationshaveadditive="replace",thefirstanimationoverridesthetransformationontherectangle
itselfandthesecondanimationoverridesthetransformationfromthefirstanimation;therefore,attime5seconds,thevisualresultoftheabovetwoanimationswouldbeequivalenttothefollowingstaticrectangle:


<recttransform="scale(2)".../>

而在下列例子中:whereasinthefollowingexample:


<recttransform="skewX(30)"...>

<animateTransformattributeName="transform"attributeType="XML"

type="rotate"from="0"to="90"dur="5s"

additive="sum"fill="freeze"/>

<animateTransformattributeName="transform"attributeType="XML"

type="scale"from="1"to="2"dur="5s"

additive="sum"fill="freeze"/>

</rect>

在这一小段代码中,因为两个动画都具有性质additive="sum",第一个动画将其变换后乘矩形本身的任何变换并且第二个动画将其变换后乘第一个动画得到的任何变换;因此,在时间为5秒的时候,上述两个动画的视觉结果等价于下列静止的矩形:Inthiscodesnippet,becausethebothanimationshaveadditive="sum",thefirstanimationpost-multipliesitstransformationtoanytransformationsontherectangleitselfandthesecondanimationpost-multipliesitstransformationtoanytransformationfromthefirstanimation;therefore,attime5seconds,thevisualresultoftheabovetwoanimationswouldbeequivalenttothefollowingstatic
rectangle:


<recttransform="skewX(30)rotate(90)scale(2)".../>

关于可用'animateTransform'元素进行动画的性质和属性的列表,请参见
可以进行动画的元素,性质和属性.Foralistofattributesandpropertiesthatcanbeanimatedusingthe'animateTransform'element,see

Elements,attributesandpropertiesthatcanbeanimated.

19.2.15可以进行动画的元素,性质和属性Elements,attributesandpropertiesthatcanbeanimated
下面列出了所有可以被'animateMotion'元素进行动画的元素:Thefollowinglistsalloftheelementswhichcanbeanimatedbyan

'animateMotion'element:

'g'

'defs'

'use'

'image'

'switch'

'path'

'rect'

'circle'

'ellipse'

'line'

'polyline'

'polygon'

'text'

'clipPath'

'mask'

'a'

'foreignObject'

在此规范中的每一个性质或属性标明了精图的动画元素对其是否可以进行动画.可以动画的性质和属性标明如下:EachattributeorpropertywithinthisspecificationindicateswhetherornotitcanbeanimatedbySVG'sanimationelements.Animatableattributes
andpropertiesaredesignatedasfollows:

Animatable:yes.

反之不能进行动画的性质和属性标明如下:whereasattributesandpropertiesthatcannotbeanimatedaredesignated:

Animatable:no.

精图为其所支持的各种各样性质和属性定义了一套基本数据类型.对于那些能够进行动画的性质和属性,下列表格表示哪一动画元素能够用于动画基本数据类型的每一个.如果给定的性质和属性可以取关键词的值(它不是叠加的)或数值(它是可叠加的),那么叠加动画是可能的如果随后的动画使用数值即使基本的动画使用关键词值;
可是,如果随后的动画使用关键词值,叠加动画是不可能的.SVGhasadefinedsetof
basicdatatypesforitsvarioussupportedattributesandproperties.Forthoseattributesandpropertiesthatcanbeanimated,thefollowingtableindicateswhichanimationelementscanbeusedtoanimateeachofthebasicdatatypes.Ifagivenattribute
orpropertycantakevaluesofkeywords(whicharenotadditive)ornumericvalues(whichareadditive),thenadditiveanimationsarepossibleifthesubsequentanimationusesanumericvalueevenifthebaseanimationusesakeywordvalue;however,ifthesubsequent
animationusesakeywordvalue,additiveanimationisnotpossible.

Datatype
Additive?
'animate'
'set'
'animate

Color'
'animate

Transform'
Notes
<angle>

yes

yes

yes

no

no

<color>

yes

yes

yes

yes

no

OnlyRGBcolorvaluesareadditive.

<coordinate>

yes

yes

yes

no

no

<frequency>

no

no

no

no

no

<integer>

yes

yes

yes

no

no

<length>

yes

yes

yes

no

no

<listofxxx>

no

yes

yes

no

no

<number>

yes

yes

yes

no

no

<paint>

yes

yes

yes

yes

no

OnlyRGBcolorvaluesareadditive.

<percentage>

yes

yes

yes

no

no

<time>

no

no

no

no

no

<transform-list>

yes

no

no

no

yes

Additivemeansthatatransformationispost-multipliedtothebasesetoftransformations.

<uri>

no

yes

yes

no

no

Allotherdatatypesusedinanimatableattributesandproperties

no

yes

yes

no

no

任何与上面表格相矛盾或者关于一个特殊性质或属性的动画能力的其它特别的注记被包含在本规范定义此性质或属性的章节中.Anydeviationfromtheabovetableorotherspecialnoteabouttheanimationcapabilitiesofaparticularattributeorpropertyisincludedinthesectionofthespecificationwherethegivenattribute
orpropertyisdefined.

19.3使用精图文档对象模型进行动画AnimationusingtheSVGDOM
Exampledom01显示了一个使用文档对象模型进行动画的简单例子.Exampledom01showsasimpleanimationusingtheDOM.


<?xmlversion="1.0"standalone="no"?>

<!DOCTYPEsvgPUBLIC"-//W3C//DTDSVG20010904//EN"

"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

<svgwidth="4cm"height="2cm"viewBox="00400200"

xmlns="http://www.w3.org/2000/svg"

onload="StartAnimation(evt)">


<scripttype="text/ecmascript"><![CDATA[

vartimevalue=0;

vartimer_increment=50;

varmax_time=5000;

vartext_element;

functionStartAnimation(evt){

text_element=evt.target.ownerDocument.getElementById("TextElement");

ShowAndGrowElement();

}

functionShowAndGrowElement(){

timevalue=timevalue+timer_increment;

if(timevalue>max_time)

return;


//Scalethetextstringgraduallyuntilitis20timeslarger

scalefactor=(timevalue*20.)/max_time;

text_element.setAttribute("transform","scale("+scalefactor+")");

//Makethestringmoreopaque

opacityfactor=timevalue/max_time;

text_element.setAttribute("opacity",opacityfactor);


//CallShowAndGrowElementagain<timer_increment>millisecondslater.

setTimeout("ShowAndGrowElement()",timer_increment)

}

window.ShowAndGrowElement=ShowAndGrowElement

]]></script>

<rectx="1"y="1"width="398"height="198"

fill="none"stroke="blue"stroke-width="2"/>


<gtransform="translate(50,150)"fill="red"font-size="7">

<textid="TextElement">SVG</text>

</g>

</svg>

Atzeroseconds

At2.5seconds

Atfiveseconds

Exampledom01
ViewthisexampleasSVG(SVG-enabledbrowsersonly)

上述精图文件包含一个单独的图形元素,一个为"SVG"的文本字符串.动画循环了5秒.文本字符串开始时较小并且是透明的逐渐增长为较大和不透明.这里是这一例子如何工作的说明:TheaboveSVGfilecontainsasinglegraphicselement,atextstringthatsays"SVG".Theanimationloopsfor5seconds.Thetextstringstartsoutsmallandtransparent
andgrowstobelargeandopaque.Hereisanexplanationofhowthisexampleworks:

onload="StartAnimation(evt)"
性质表示,一旦文档完全加载并且被处理,调用ECMAScript函数
StartAnimation
.The
onload="StartAnimation(evt)"
attributeindicatesthat,oncethedocumenthasbeenfullyloadedandprocessed,invokeECMAScriptfunction
StartAnimation
.
'script'元素定义ECMAScript此脚本生成将播放的动画.
StartAnimation()
函数仅调用一次来给全局变量
text_element
赋值并执行
ShowAndGrowElement()
的首次调用.每隔50毫秒调用一次
ShowAndGrowElement()
并且在每次调用时重新设置此文本元素的
transform
和
style
性质的值.在
ShowAndGrowElement
的末尾,函数告诉ECMAScript引擎在50毫秒之后再次调用本身.The'script'elementdefinestheECMAScriptwhichmakestheanimationhappen.The
StartAnimation()
functionisonlycalledoncetogiveavaluetoglobalvariable
text_element
andtomaketheinitialcallto
ShowAndGrowElement()
.
ShowAndGrowElement()
iscalledevery50millisecondsandresetsthe
transform
and
style
attributesonthetextelementtonewvalueseachtimeitiscalled.Attheendof
ShowAndGrowElement
,thefunctiontellstheECMAScriptenginetocallitselfagainafter50moremilliseconds.

'g'元素平移坐标系使得将原点移到视区的左下角.它也定义了当绘制文本字符串时所使用的填充颜色和字体尺寸.The'g'elementshiftsthecoordinatesystemsothattheoriginisshiftedtowardthelower-leftoftheviewingarea.Italsodefinesthefillcolorandfont-sizetousewhendrawingthetextstring.

'text'元素包含文本字符串并且是其性质在动画期间发生变化的那个元素.The'text'elementcontainsthetextstringandistheelementwhoseattributesgetchangedduringtheanimation.

如果脚本修改由精图的动画元素进行动画的性质或属性,脚本修改动画的基值.当一个动画元素正在动画一个性质或属性时脚本改变了此性质或属性的基值,动画被要求动态地调整到新地基值.Ifscriptsaremodifyingthesameattributes
orpropertiesthatarebeinganimatedbySVG's
animationelements,thescriptsmodifythebasevaluefortheanimation.Ifabasevalueismodifiedwhileananimationelementisanimatingthecorrespondingattributeorproperty,theanimationsarerequiredtoadjustdynamicallytothenewbasevalue.

如果脚本在动画元素对一属性进行动画地同时对此在覆盖样式表上的属性进行修改,结果与实现相关;于是,建议避免这种情况发生.Ifascriptismodifyingapropertyontheoverridestylesheetat
thesametimethatan
animationelementisanimatingthatproperty,theresultisimplementation-dependent;thus,itisrecommendedthatthisbeavoided.

19.4文档对象模型接口DOMinterfaces
Thefollowingtwointerfacesarefrom
SMILAnimation.Theyareincludedhereforeasyreference:

InterfaceElementTimeControl
TheElementTimeControlinterface,partoftheorg.w3c.dom.smilmoduleanddefinedin

SMILAnimation:Supportedinterfaces,definescommonmethodsforelementswhichdefineanimationbehaviorscompatiblewithSMILAnimation.

Calling
beginElement()
causestheanimationtobegininthesamewaythatananimationwithevent-basedbegintimingbegins.TheeffectivebegintimeisthecurrentpresentationtimeatthetimeoftheDOMmethodcall.Notethat
beginElement()
issubjecttothe
restart
attributeinthesamemannerthatevent-basedbegintimingis.Ifananimationisspecifiedtodisallowrestartingatagivenpoint,
beginElement()
methodscallsmustfail.Referalsotothesection
Restartinganimation.

Calling
beginElementAt(seconds)
hasthesamebehavioras
beginElement()
,exceptthattheeffectivebegintimeisoffsetfromthecurrentpresentationtimebyanamountspecifiedasaparameter.Passinganegativevaluefortheoffset
causestheelementtobeginasfor
beginElement()
,buthastheeffectthattheelementbeginsatthespecifiedoffsetintoitsactiveduration.The
beginElementAt()
methodmustalsorespectthe
restart
attribute.Therestartsemanticsfora
beginElementAt()
methodcallareevaluatedatthetimeofthemethodcall,andnotattheeffectivebegintimespecifiedbytheoffsetparameter.

Calling
endElement()
causesananimationtoendtheactiveduration,justas
end
does.Dependinguponthevalueofthe
fill
attribute,theanimationeffectmaynolongerbeapplied,oritmaybefrozenatthecurrenteffect.Referalsotothesection

Freezinganimations.Ifananimationisnotcurrentlyactive(i.e.ifithasnotyetbegunorifitisfrozen),the
endElement()
methodwillfail.

Calling
endElementAt()
causesananimationtoendtheactiveduration,justas
endElement()
does,butallowsthecallertospecifyapositiveoffset,tocausetheelementtoendatapointinthefuture.Otherthandelayingwhentheendactuallyhappens,thesemanticsareidenticaltothosefor
endElement()
.If
endElementAt()
iscalledmorethanoncewhileanelementisactive,theendtimespecifiedbythelastmethodcallwilldeterminetheendbehavior.

IDLDefinition


interfaceElementTimeControl{


booleanbeginElement()

raises(DOMException);

booleanbeginElementAt(infloatoffset)

raises(DOMException);

booleanendElement()

raises(DOMException);

booleanendElementAt(infloatoffset)

raises(DOMException);

};


MethodsbeginElement

Causesthiselementtobeginthelocaltimeline(subjecttorestartconstraints).

NoParameters

Returnvalue

boolean

true
ifthemethodcallwassuccessfulandtheelementwasbegun.
false
ifthemethodcallfailed.Possiblereasonsforfailureinclude:

Theelementisalreadyactiveandcannotberestartedwhenitisactive.The
restart
attributeissetto
"whenNotActive"
.
Theelementisactiveorhasbeenactiveandcannotberestarted.The
restart
attributeissetto
"never"
.

Exceptions

DOMException

SYNTAX_ERR:Theelementwasnotdefinedwiththeappropriatesyntaxtoallow
beginElement
calls.

beginElementAt

Causesthiselementtobeginthelocaltimeline(subjecttorestartconstraints),atthepassedoffsetfromthecurrenttimewhenthemethodiscalled.Iftheoffsetis>=0,thesemanticsareequivalenttoanevent-basebeginwiththespecifiedoffset.If
theoffsetis<0,thesemanticsareequivalenttobeginElement(),buttheelementactivedurationisevaluatedasthoughtheelementhadbegunatthepassed(negative)offsetfromthecurrenttimewhenthemethodiscalled.

Parameters

infloatoffset

Theoffsetinsecondsatwhichtobegintheelement.

Returnvalue

boolean

true
ifthemethodcallwassuccessfulandtheelementwasbegun.
false
ifthemethodcallfailed.Possiblereasonsforfailureinclude:

Theelementisalreadyactiveandcannotberestartedwhenitisactive.The
restart
attributeissetto
"whenNotActive"
.
Theelementisactiveorhasbeenactiveandcannotberestarted.The
restart
attributeissetto
"never"
.

Exceptions

DOMException

SYNTAX_ERR:Theelementwasnotdefinedwiththeappropriatesyntaxtoallow
beginElementAt
calls.

endElement

Causesthiselementtoendthelocaltimeline.

NoParameters

Returnvalue

boolean

true
ifthemethodcallwassuccessfulandtheelementwasended.
false
ifmethodcallfailed.Possiblereasonsforfailureinclude:

Theelementisnotactive.

Exceptions

DOMException

SYNTAX_ERR:Theelementwasnotdefinedwiththeappropriatesyntaxtoallow
endElement
calls.

endElementAt

Causesthiselementtoendthelocaltimelineatthespecifiedoffsetfromthecurrenttimewhenthemethodiscalled.

Parameters

infloatoffset

Theoffsetinsecondsatwhichtoendtheelement.Mustbe>=0.

Returnvalue

boolean

true
ifthemethodcallwassuccessfulandtheelementwasended.
false
ifthemethodcallfailed.Possiblereasonsforfailureinclude:

Theelementisnotactive.

Exceptions

DOMException

SYNTAX_ERR:Theelementwasnotdefinedwiththeappropriatesyntaxtoallow
endElementAt
calls.

ThecorrespondingJavabinding:


packageorg.w3c.dom.svg;


importorg.w3c.dom.DOMException;


publicinterfaceElementTimeControl{

booleanbeginElement()

throwsDOMException;

booleanbeginElementAt(floatoffset)

throwsDOMException;

booleanendElement()

throwsDOMException;

booleanendElementAt(floatoffset)

throwsDOMException;

}


InterfaceTimeEvent
TheTimeEventinterface,definedin
SMILAnimation:Supportedinterfacesdefinedin
SMILAnimation:Supportedinterfaces,providesspecificcontextualinformationassociatedwithTimeevents.

Thedifferenttypesofeventsthatcanoccurare:

beginEvent

Thiseventisraisedwhentheelementlocaltimelinebeginstoplay.Itwillberaisedeachtimetheelementbeginstheactiveduration(i.e.whenitrestarts,butnotwhenitrepeats).Itmayberaisedbothinthecourseofnormal(i.e.scheduledorinteractive)
timelineplay,aswellasinthecasethattheelementwasbegunwiththe
beginElement()
or
beginElementAt()
methods.Notethatifanelementisrestartedwhileitiscurrentlyplaying,theelementwillraiseanendeventandanotherbeginevent,astheelementrestarts.

·Bubbles:No

·Cancelable:No

·ContextInfo:None

endEvent

Thiseventisraisedattheactiveendoftheelement.Notethatthiseventisnotraisedatthesimpleendofeachrepeat.Thiseventmayberaisedbothinthecourseofnormal(i.e.scheduledorinteractive)timelineplay,aswellasinthecasethattheelement
wasendedwiththe
endElement()
or
endElementAt()
methods.Notethatifanelementisrestartedwhileitiscurrentlyplaying,theelementwillraiseanendeventandanotherbeginevent,astheelementrestarts.

·Bubbles:No

·Cancelable:No

·ContextInfo:None

repeatEvent

Thiseventisraisedwhenanelementlocaltimelinerepeats.Itwillberaisedeachtimetheelementrepeats,afterthefirstiteration.

Theeventprovidesanumericalindicationofwhichrepeatiterationisbeginning.Thevalueisa0-basedinteger,buttherepeateventisnotraisedforthefirstiterationandsotheobservedvaluesofthedetailattributewillbe>=1.

·Bubbles:No

·Cancelable:No

·ContextInfo:detail(currentiteration)

IDLDefinition


interfaceTimeEvent:events::Event{

readonlyattributeviews::AbstractViewview;

readonlyattributelongdetail;


voidinitTimeEvent(inDOMStringtypeArg,inviews::AbstractViewviewArg,inlongdetailArg);

};


Attributes

readonlyviews::AbstractViewview

The
view
attributeidentifiestheAbstractView[DOM2-VIEWS]fromwhichtheeventwasgenerated.

readonlylongdetail

SpecifiessomedetailinformationabouttheEvent,dependingonthetypeoftheevent.Forthiseventtype,indicatestherepeatnumberfortheanimation.

Methods

initTimeEvent

TheinitTimeEventmethodisusedtoinitializethevalueofaTimeEventcreatedthroughthe
DocumentEventinterface.ThismethodmayonlybecalledbeforetheTimeEventhasbeendispatchedviathe
dispatchEventmethod,thoughitmaybecalledmultipletimesduringthatphaseifnecessary.Ifcalledmultipletimes,thefinalinvocationtakesprecedence.

Parameters

inDOMStringtypeArg

Specifiestheeventtype.

inviews::AbstractViewviewArg

SpecifiestheEvent'sAbstractView.

inlongdetailArg

SpecifiestheEvent'sdetail.

NoReturnValue

NoExceptions

ThecorrespondingJavabinding:


packageorg.w3c.dom.svg;


importorg.w3c.dom.events.Event;

importorg.w3c.dom.views.AbstractView;


publicinterfaceTimeEventextends

Event{

publicAbstractViewgetView();

publicintgetDetail();


voidinitTimeEvent(StringtypeArg,AbstractViewviewArg,intdetailArg);

}

Thefollowinginterfacesaredefinedbelow:
SVGAnimationElement,
SVGAnimateElement,
SVGSetElement,
SVGAnimateMotionElement,
SVGMPathElement,
SVGAnimateColorElement,
SVGAnimateTransformElement.

InterfaceSVGAnimationElement
TheSVGAnimationElementinterfaceisthebaseinterfaceforalloftheanimationelementinterfaces:

SVGAnimateElement,SVGSetElement,SVGAnimateColorElement,SVGAnimateMotionElementand

SVGAnimateTransformElement.

UnlikeotherSVGDOMinterfaces,theSVGDOMdoesnotspecifyconvenienceDOMpropertiescorrespondingtothevariouslanguageattributesonSVG'sanimationelements.Specificationoftheseconveniencepropertiesinawaythatwillbecompatiblewithfuture
versionsofSMILAnimationisexpectedinafutureversionofSVG.Thecurrentmethodforaccessingandmodifyingtheattributesontheanimationelementsistousethestandard
getAttribute
,
setAttribute
,
getAttributeNS
and
setAttributeNS
definedinDOM2.

IDLDefinition


interfaceSVGAnimationElement:

SVGElement,

SVGTests,

SVGExternalResourcesRequired,

smil::ElementTimeControl,

events::EventTarget{


readonlyattributeSVGElementtargetElement;


floatgetStartTime();

floatgetCurrentTime();

floatgetSimpleDuration()

raises(DOMException);

};


Attributes

readonlySVGElementtargetElement

Theelementwhichisbeinganimated.

Methods

getStartTime

Returnsthestarttimeinsecondsforthisanimation.

NoParameters

Returnvalue

float

Thestarttimeinsecondsforthisanimationrelativetothestarttimeofthetimecontainer.

NoExceptions

getCurrentTime

Returnsthecurrenttimeinsecondsrelativetotimezeroforthegiventimecontainer.

NoParameters

Returnvalue

float

Thecurrenttimeinsecondsrelativetotimezeroforthegiventimecontainer.

NoExceptions

getSimpleDuration

Returnsthenumberofsecondsforthesimpledurationforthisanimation.Ifthesimpledurationisundefined(e.g.,theendtimeisindefinite),thenanexceptionisraised.

NoParameters

Returnvalue

float

Thenumberofsecondsforthesimpledurationforthisanimation.

Exceptions

DOMException

NOT_SUPPORTED_ERR:Thesimpledurationisnotdeterminedonthegivenelement.

InterfaceSVGAnimateElement
TheSVGAnimateElementinterfacecorrespondstothe'animate'element.

Object-orientedaccesstotheattributesofthe'animate'elementviatheSVGDOMisnotavailable.

IDLDefinition


interfaceSVGAnimateElement:SVGAnimationElement{};


InterfaceSVGSetElement
TheSVGSetElementinterfacecorrespondstothe'set'element.

Object-orientedaccesstotheattributesofthe'set'elementviatheSVGDOMisnotavailable.

IDLDefinition


interfaceSVGSetElement:SVGAnimationElement{};


InterfaceSVGAnimateMotionElement
TheSVGAnimateMotionElementinterfacecorrespondstothe'animateMotion'element.

Object-orientedaccesstotheattributesofthe'animateMotion'elementviatheSVGDOMisnotavailable.

IDLDefinition


interfaceSVGAnimateMotionElement:SVGAnimationElement{};


InterfaceSVGMPathElement
TheSVGMPathElementinterfacecorrespondstothe'mpath'element.

IDLDefinition


interfaceSVGMPathElement:

SVGElement,

SVGURIReference,

SVGExternalResourcesRequired{};


InterfaceSVGAnimateColorElement
TheSVGAnimateColorElementinterfacecorrespondstothe'animateColor'element.

Object-orientedaccesstotheattributesofthe'animateColor'elementviatheSVGDOMisnotavailable.

IDLDefinition


interfaceSVGAnimateColorElement:SVGAnimationElement{};


InterfaceSVGAnimateTransformElement
TheSVGAnimateTransformElementinterfacecorrespondstothe'animateTransform'element.

Object-orientedaccesstotheattributesofthe'animateTransform'elementviatheSVGDOMisnotavailable.

IDLDefinition


interfaceSVGAnimateTransformElement:SVGAnimationElement{};


previous

next
contents
elements
attributes
properties
index
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航