svg结构数据字典1.doc

目 录一、 总体说明2二、信息显示区42.1 常见节点42.2动作节点说明62.2.1 节点62.2.2 animate节点62.2.3 animateColor节点72.2.4 animateMotion节点72.2.5 animateTransform 节点82.2.6 cursor节点82.2.7 变换操作82.2.8 g 节点92.2.9 symbol 节点92.2.10 use 节点102.2.11 文本输出102.2.12 颜色102.2.13 对中文的支持112.3 图形节点说明112.3.1 circle112.3.2 rect 节点122.3.3ellipse节点122.3.4 line 节点132.3.5 polyline 节点132.3.6 polygon 节点132.3.7 path节点142.4 效果节点说明142.4.1 滤镜142.4.2渐变16线性渐变16放射性渐变163SVG对事件的响应174. 使用CSS属性185. viewBox18一、 总体说明SVG 是使用 XML 来描述二维图形和绘图程序的语言。与其他图像格式相比，使用 SVG 的优势在于： SVG 可被非常多的工具读取和修改（比如记事本） SVG 与 JPEG 和 GIF 图像比起来，尺寸更小，且可压缩性更强。 SVG 是可伸缩的 SVG 图像可在任何的分辨率下被高质量地打印 SVG 可在图像质量不下降的情况下被放大 SVG 图像中的文本是可选的，同时也是可搜索的（很适合制作地图） SVG 可以与 Java 技术一起运行 SVG 是开放的标准 SVG 文件是纯粹的 XML所有浏览器均支持 SVG 文件，只有IE(Internet Explorer)需要安装插件。插件是免费的，比如Adobe SVG Viewer(/svg/viewer/install/)。一个svg文件主要包含下面3部分：从本质上来说，SVG 文档是 XML 文档。这就是说 SVG 文档有某些基本属性。所以文档应该以 XML 声明 开始。version属性表示XML的版本，因为解析器对不同的版本的解析肯定会有区别，尽管目前版本只有1.0版本，但在声明中必须指定version属性。standalone属性规定本svg文件是否是独立的，如果将其设置为”yes”,则表示该文档没有依赖外面的任何文件而可以独立存在，即不需要DTD文件来验证其中的标识是否有效，也不需要XSL、CSS文件来控制其显示外观；将standalone属性设置为”no”时，则表示该文档依赖于外面的某个文件，例如依赖于某个DTD文件或XSL、CSS文件。standalone属性的默认值是”yes”。encoding由于可以采用不同的字符编码集来书写一个字符内容完全相同的XML文档，所以，XML软件工具（包括分析器）就需要知道该XML文档所使用的字符编码方式。这可以通过在XML文档声明中指定encoding属性来说明。指定外部的DTD。XML文档通过使用DOCTYPE声明语句（文档类型定义语句）来指明它所遵循的DTD文件。DOCTYPE声明语句紧跟在XML文档声明语句后面，有两种格式：（1）（2）各部分的意义和作用如下：文档类型名称可以由XML文档编写者自己定义，一个通用的习惯是使用XML文档的根元素名称来作为文档类型名称。关键字SYSTEM表明XML文件所遵循的是一个本地或组织内部所编写和使用的DTD文件。关键字PUBLIC表明该XML文件所遵循的是一个由权威机构制定的、公开提供给特定行业或公众使用的DTD文件，而不是某个组织内部的规范文件。“DTD名称”用于指定该DTD文件的标识名称，它只在使用关键字PUBLIC的DOCTYPE声明语句中出现。DTD标识名称需要用双引号括起来，例如，用于Java Web应用程序的配置文件的DTD文件的标识名称为”-/Sun Microsystems,Inc./DTD Web Application 2.3/EN”。DTD标识名称应符合一些标准的规定，对于ISO标准的DTD以”ISO”三个字母开头；被改进的非ISO标准的DTD以加号”+”开头；未被改进的非ISO标准的DTD以减号”-”开头。紧跟着开始部分后面的是双斜杠”/”及DTD所有者的名称，在这个名称之后又是双斜杠”/”，之后是DTD所描述的文件的说明，最后在双斜杠”/”之后是语言的种类。虽然标识名称看上去比较复杂，但这完全是由DTD文件发布者去考虑的事情，XML文件的编写者只要把DTD文件的发布者事先定义好的DTD标识名称复制到相应的位置就可以了。“DTD文件的URL”部分指定该DTD文件所在的位置，需要用双引号括起来。对于使用PUBLIC属性的DOCTYPE语句，”DTD文件的URL”指定该该DTD文件的在Internet上的绝对URL，例如，用于Java Web应用程序的配置文件的DTD文件的位置为“/dtd/Web-app_2_3.dtd”。解析器在对XML文档进行有效性确认时，通常都需要从该指定的URL下载DTD文件，但是，对于一些已经制定成为了行业标准的DTD文件，一些相应的解释器程序可能已经将他们内嵌进去，所以在解析时并不一定到指定的URL进行下载。对于使用SYSTEM属性的DOCTYPE语句，”DTD文件的URL”除了可以是Internet上的一个绝对URL外，它还可以是一个本地文件系统的相对路径。该DTD”/Graphics/SVG/1.1/DTD/svg11.dtd”，在W3C网站上，并包含所有可用的svg元素。实现画图区标记告诉浏览器，这是一个SVG文档，SVG文档的宽和高（或叫做SVG的画布大小）用height和width属性来定义，如果不定义 width和height属性的话，画布的范围将是整个浏览器，x，y属性告诉浏览器将SVG画布放到什么位置，x属性与我们平常所用top属性相同，指浏览器的top位置，y属性等同于浏览器的left位置，当然，这里也可以使用相对位置来定位，即百分比。在指定width和height后，我们实际上就建立了一个显示图形的显示区，单位可以使用em、ex、px、pt、pc、cm、mm，如果不指定单位，则缺省的单位是像素点。所有其他物品的测量数字的单位与width和height所使用的单位相同。svg文档以根元素开始，包含开始标签和结束标签。version属性定义了svg的版本，xmlns属性定义了svg的名称空间。名称空间的声明指定了这些 SVG 元素位于 SVG 名称空间内，编写这些元素时无需带任何名称空间的前缀。在使用Adobo SVG Viewer3.0浏览 SVG 图像时可以缺省定义这些命名空间，Adobo SVG Viewer3.0浏览环境会默认的将文档内的 XML 元素识别为SVG 元素。但当我们使用Batik 浏览 SVG 图像时，这些命名空间是必须要指定的，否则，脚本的链接和其他一些复杂的功能将不能起作用。二、信息显示区2.1 常见节点svg根节点a定义超链接altGlyph允许对象性文字进行控制，来呈现特殊的字符数据（例如，音乐符号或亚洲的文字）altGlyphDef定义一系列象性符号的替换（例如，音乐符号或者亚洲文字）altGlyphItem定义一系列候选的象性符号的替换animate随时间动态改变属性animateColor规定随时间进行的颜色转换animateMotion使元素沿着动作路径移动animateTransform对元素进行动态的属性转换circle定义圆clipPathcolor-profile规定颜色配置描述cursor定义独立于平台的光标definition-src定义单独的字体定义源defs被引用元素的容器desc对 SVG 中的元素的纯文本描述 - 并不作为图形的一部分来显示。用户代理会将其显示为工具提示。ellipse定义椭圆feBlendSVG 滤镜。使用不同的混合模式把两个对象合成在一起。feColorMatrixSVG 滤镜。应用matrix转换。feComponentTransferSVG 滤镜。执行数据的 component-wise 重映射。feCompositeSVG 滤镜。feConvolveMatrixSVG 滤镜。feDiffuseLightingSVG 滤镜。feDisplacementMapSVG 滤镜。feDistantLightSVG 滤镜。 Defines a light sourcefeFloodSVG 滤镜。feFuncASVG 滤镜。feComponentTransfer 的子元素。feFuncBSVG 滤镜。feComponentTransfer 的子元素。feFuncGSVG 滤镜。feComponentTransfer 的子元素。feFuncRSVG 滤镜。feComponentTransfer 的子元素。feGaussianBlurSVG 滤镜。对图像执行高斯模糊。feImageSVG 滤镜。feMergeSVG 滤镜。创建累积而上的图像。feMergeNodeSVG 滤镜。feMerge的子元素。feMorphologySVG 滤镜。 对源图形执行fattening 或者 thinning。feOffsetSVG 滤镜。相对与图形的当前位置来移动图像。fePointLightSVG 滤镜。feSpecularLightingSVG 滤镜。feSpotLightSVG 滤镜。feTileSVG 滤镜。feTurbulenceSVG 滤镜。filter滤镜效果的容器。font定义字体。font-face描述某字体的特点。font-face-formatfont-face-namefont-face-srcfont-face-uriforeignObjectg用于把相关元素进行组合的容器元素。glyph为给定的象形符号定义图形。glyphRef定义要使用的可能的象形符号。hkernimageline定义线条。linearGradient定义线性渐变。markermaskmetadata规定元数据。missing-glyphmpathpath定义路径。patternpolygon定义由一系列连接的直线组成的封闭形状。polyline定义一系列连接的直线。radialGradient定义放射形的渐变。rect定义矩形。script脚本容器。（例如ECMAScript）set为指定持续时间的属性设置值stopstyle可使样式表直接嵌入SVG内容内部。svg定义SVG文档片断。switchsymboltexttextPathtitle对 SVG 中的元素的纯文本描述 - 并不作为图形的一部分来显示。用户代理会将其显示为工具提示。treftspanuseviewvkern 2.2动作节点说明根节点：所有图片元素的根节点，一个svg文档中作为根节点只能出现一次，但可以作为的子节点出现多次如：。所有图片元素节点都是它的子节点属性名语法说明id可选属性，但必须确保值是唯一，即不能与其他的id值有相同version可选属性，定义所使用的 SVG 版本width可选属性，设置此 SVG 文档的宽度height可选属性，设置此 SVG 文档的高度xmlns必选属性，定义 SVG 命名空间。 2.2.1 节点定义超链接，与html中的超链接标签类似，可以使当前页面跳转到节点中指定的页面。实际用例：节点属性：xlink:href指定跳转页面地址。Target：指示查看程序在单击这个元素时以何种方式打开一个新的浏览器窗口子节点：可以是其他元素节点2.2.2 animate节点随时间动态改变属性节点属性： animateMotionrestart: 定义动画的重播方式，属性值可以设为always(满足条件的任意时刻重播)、whenNotactive(只有播放结束后才会重新开始，不受任何外界影响)以及never(不重播)。repeatCount: 定义重播次数。repeatDur:定义重播的总时间。fill:定义动画播放完毕后是停留在终点还是回到起点。子节点：可以是其他元素节点2.2.3 animateColor节点规定随时间进行的颜色转换节点属性：from 初始颜色to：变幻颜色repeatCount：定义重播次数dur：单次播放时间子节点：可以是其他元素节点样例： 2.2.4 animateMotion节点使元素沿着动作路径移动节点属性： repeatCount: 定义重播次数。repeatDur:定义重播的总时间。fill:定义动画播放完毕后是停留在终点还是回到起点。rotate( )：指定绕给定点旋转 度dur:单次动画时间path:动画路径子节点：可以是其他元素节点样例：2.2.5 animateTransform 节点对元素进行动态的属性转换节点属性：attributeName：指定要进行动画变化的属性名称，可根据实际情况带上XML的名称空间。attributeType：指定要变化的属性和属性值在什么名称空间里定义。可有三种选择之一：CSS、XML、auto。“CSS”指定attributeName的值是CSS属性的名字；“XML”指定attributeName的值是默认XML名称空间里定义的XML属性名；“auto”是默认值，首先搜索CSS属性列表看能否匹配attributeName，如果不能找到匹配的值，则寻找该元素的缺省XML名称空间begin：指定元素何时进行动画。可以取的值有： offset-value、syncbase-value、event-value、repeat-value、accessKey-value、wallclock-sync-value、indefinite ，offset-value是相对于文档开始的时间，不能为负值；syncbase-value是相对于另外动画元素的同步时间，必须包含另外元素的id值；event-value是由事件触发；repeat-value是重复事件，元素动画开始时间是相对于重复事件触发的时间；accessKey-value是指相对于用户的键盘输入的时间； wallclock-sync-value是现实世界中的时间；indefinite是由beginElement()的调用或被链接到该元素决定是否开始动画。该属性如果同时选择多个值的话，要以分号“;”隔开。子节点：可以是其他元素节点样例：2.2.6 cursor节点定义独立于平台的光标，但是Adobe SVGViewer3.6不支持cursor，所以在IE下无作用，在火狐下可以正常节点属性： 子节点：无样例：2.2.7 变换操作在使用SVG时，经常要使用到象缩放、平移这样的操作。执行变换改变了元素所在的坐标系统，改变了它的外观。变换可以用来以数种方式改变元素的外观：translate(x,y)：该变换按指定数量偏移元素。scale(x, y)：该变换更改元素的大小。可以分别控制 x 和 y 方向上缩放量，但如果只指定一个值，那么它将用于两个方向。缩放量可以是负数。rotate(n,x,y)：对( x , y )旋转坐标轴。说明：若没有给旋转中心，则以原点为预设旋转中心。需要注意的是，在旋转变换中使用的角度是以度为单位的，正的数值表明是顺时针方向，0度表示正东，90度表示正南等。skewX(n)/ skewY(n) ：这两种变换根据适当的轴按指定的像素数量偏斜元素。也可以使用矩阵指定变换。在具体使用时，需注意的是transform 属性的设置效果是一次性的而不是累加的，通过scale所进行的地图缩放是以地图的左上角为基点实施的。2.2.8 g 节点预定义图形组，比如把一个矩形和两个圆组合成一个专用变压器。那么增加新的图标（专用变压器）就只是在不同的位置增加一个引用而已。再不增加实际的绘图数据。这样减少了数据量；同时，如果要修改某类信息的显示图标，只要修改预定义的图标即可，方便了管理。 节点属性： transform指定的大小和位置translate指定图标的x方向和y方向的偏移。scale指定图标的缩放比例。Visibility：visible|hidden 显示和隐藏这个图形组。子节点：无样例：2.2.9 symbol 节点Symobl节点 与 g 节点的作用很类似，但也有区别：是绘图对象，,而不是。也就是说下面的图形对象将被直接绘制在终端设备表面，而一般用于预定义的图元，通过引用实现重复应用。在功能上，你可以把对象看成是放在节点中的对象，就是这样，在节点内部，和基本上一样。但是如果不在内部，内部的形状对象将被直接绘制，而不能。比较一下这两段代码：这将绘制一个红色矩形。如果将上面代码将替换成将不会绘制任何东西。但是对于下面这段代码,将和互相替换则效果都是一样另外对象可以通过viewBox属性控制视图显示，而不能。所以对于预定义图元，推荐使用symbol，表现力要多一些。symbol相对于有更多属性,如viewBox,overflow等,可以更多控制引用对象的表现方式。Owerflow可以理解为溢位或溢流，将overflow的值设置为visible，这样在symbol中的超出视图正常范围的图元就会完整显示出来了。2.2.10 use 节点引用预定义项，将它们链接到文档中，如：。其中c1为字节里定义的元素的id属性值。样例：2.2.11 文本输出SVG图像还可以通过text标注输出文本信息。SVG提供给设计人员对文本的大量控制，可以获得很好的图形效果。节点属性： 元素主要属性有：x,y,dx,dy,rotate,textLength。x,y：表示文本的横纵坐标。dx,dy：表示移动的横纵坐标。Rotate：表示旋转的度数。textLength：文本的长度。样例：Welcome to the world of SVG!任何可以在形状或路径上执行的操作（如绘制或滤镜）都可以在文本上执行。一个不足之处是 SVG 不执行自动换行。如果文本比允许空间长，则简单地将它切断。多数情况下，创建多行文本需要多个文本元素。可以使用 tspan 元素将文本元素分成几部分，允许每部分有各自的样式。在 text 元素中，空格的处理与 HTML 类似；换行和回车变成空格，而多个空格压缩成单个空格。Welcome to the world of SVG!2.2.12 颜色颜色对于 SVG 图像是极其重要的。单个颜色可以直接使用它们的 RGB 值指定，或者使用差不多 150 个颜色关键字中的一个来间接指定，该关键字也引用 RGB 值。R即RED;G即GREEN;B即BLUE。采用rgb的格式表示为rgb(255,0,0)表示红色，rgb(0,255,0)表示绿色，rgb(0,0,255)表示蓝色。RGB 值在 0 到 255 数值范围内指定一种颜色的红、绿、蓝成分的相对亮度。SVG也支持颜色名和16进制的颜色格式，比如:fill:red或fill:#ff0000。2.2.13 对中文的支持1、将文件存成UTF-82、要在svgviewer中显示中文字体，需要将中文字体名称进行”国际化”， 即将汉字字体名称改为英文名称，如将”宋体”改为”Simsun，”黑体”改为Simhei等，下面是部分字体对照列表：English Name Localized Name SimSun 宋体 SimHei 黑体 FangSong_GB2312 仿宋_GB2312 KaiTi_GB2312 楷体_GB2312 YouYuan 幼圆 STSong 华文宋体 STZhongsong 华文中宋 STKaiti 华文楷体 STFangsong 华文仿宋 STXihei 华文细黑 STLiti 华文隶书 STXingkai 华文行楷 STXinwei 华文新魏 STHupo 华文琥珀 STCaiyun 华文彩云 FZYaoTi 方正姚体简体 FZShuTi 方正舒体简体 NSimSun 新宋体 LiSu 隶书样例： 这里可以显示中文了 2.3 图形节点说明svg包含6种基本图形：矩形 (rect)圆形 (cir5cle)椭圆 (ellipse)线条 (line)多边形 (polygon折线 (polyline)这些基本形状和路径（path）一道，可以组合成任意形状的图像。每个基本形状都带有SVG 语法结构说明指定其位置和大小的属性。它们的颜色和轮廓分别由fill、stroke、stroke-width属性确定。下面一一介绍其语法：2.3.1 circle定义圆节点属性： cx 、 cy ：定义圆点的 x 和 y 坐标。如果省略 cx 和 cy，圆的中心会被设置为 (0, 0)r ：属性定义圆的半径stroke：边框颜色stroke-width：边框宽度fill：填充颜色cursor：定义独立于平台的光标，但是Adobe SVGViewer3.6不支持cursor，所以在IE下无作用，在火狐下可以正常子节点：无样例：2.3.2 rect 节点定义一个矩形节点属性：x、y：分别定义了矩形的距离左边和顶部的位置；CSS 的 fill-opacity：定义填充颜色透明度（合法的范围是：0 - 1） CSS 的 stroke-opacity：定义笔触颜色的透明度（合法的范围是：0 - 1）子节点：无样例：（样例图）2.3.3ellipse节点定义一个椭圆节点属性：cx：是椭圆中心在用户坐标系中的X坐标值，缺省值为0.cy：是椭圆中心在用户坐标系中的Y坐标值，缺省值为。rx：是X方向上椭圆的半轴长，不允许为负数。如果是0，则椭圆不显示。ry：是Y方向上椭圆的半轴长，不允许为负数。如果是。，则椭圆不显示。style：允许我们定义SVG推荐标准支持的CSS样式属性。子节点：无样例：（样例图）2.3.4 line 节点线段通过指定开始点(x1，y1)、结束点(x2，y2)和宽度stroke定义一条直线。要想得到很细的线，可以指定stroke-width为大于0小于1的数值。节点属性：x1：是线段起点的X坐标值，缺省值为0。yl：是线段起点的Y坐标值，缺省值为0。x2：是线段终点的X坐标值，缺省值为0。y2：是线段终点的Y坐标值，缺省值为0。stroke-dasharray：定义所画的线段为虚线，例如stroke-dasharray=4,2则表示虚线的显示为4长度，空为2长度：如图子节点：无样例：2.3.5 polyline 节点折线这个标记通过指定各个点的坐标，来定义一条折线节点属性：points：表示折线各顶点坐标的一个列表，顶点坐标的格式为”x,y，其中x表示顶点的横坐标、x表示顶点的纵坐标，不同顶点坐标之间用空格分开。绘图程序将按照points中的顶点依次绘制图形。style：允许我们定义SVG推荐标准支持的CSS样式属性。子节点：无样例：（样例图）2.3.6 polygon 节点用来创建含有不少于三个边的图形。节点属性：points：points的取值与折线的points一样，但是在绘制多边形的时候，绘图程序不但按照points中的顶点依次绘制图形，而且还将最后一个顶点与第一个顶点连接起来构成一个封闭图形。子节点：无样例：（样例图）2.3.7 path节点路径标记是SVG中最复杂的，它创建最复杂的形状，路径是一系列命令，用来创建作为图像一部分精确定义的形状。该形状可以是开放的（如线）或闭合的（如多边形），并可以包含一条或多条线、曲线和线段。特别是在这两种情况下：第一，当图像需要曲线，它不能由多边形或折线创建，第二，当动画或文本需要沿页面上的特定形状前进时。这就需要路径了。节点属性：M = 移动L = 画直线H = 水平画线V = 垂直画线C = 画曲线S = 画平滑曲线Q = 画贝塞尔曲线T = 画平滑贝塞尔曲线A = 画圆弧Z = 关闭路径的描绘。注：大写字母说明这些坐标是相对于整个坐标系统的绝对坐标。小写字母命令则指明为相对坐标。2.4 效果节点说明Svg的效果主要有滤镜和渐变2.4.1 滤镜在 SVG 中，可用的滤镜有： feBlend feColorMatrix feComponentTransfer feComposite feConvolveMatrix feDiffuseLighting feDisplacementMap feFloodfeGaussianBlur feImage feMerge feMorphology feOffset feSpecularLighting feTile feTurbulence feDistantLight fePointLight feSpotLight必须在 标签中定义 SVG 滤镜。高斯模糊（Gaussian Blur）：节点属性： ：用来定义 SVG 滤镜。 标签使用必需的 id 属性来定义向图形应用哪个滤镜？ 标签必须嵌套在 标签内。 标签是 definitions 的缩写，它允许对诸如滤镜等特殊元素进行定义。 标签的 id 属性可为滤镜定义一个唯一的名称（同一滤镜可被文档中的多个元素使用）filter:url：属性用来把元素链接到滤镜。当链接滤镜 id 时，必须使用 # 字符。：滤镜效果是通过 标签进行定义的。fe 后缀可用于所有的滤镜 标签的stdDeviation：属性可定义模糊的程度in=SourceGraphic 这个部分定义了由整个图像创建效果样例：（样例图）2.4.2渐变SVG 渐变必须在 标签中进行定义。渐变是一种从一种颜色到另一种颜色的平滑过渡。另外，可以把多个颜色的过渡应用到同一个元素上。在 SVG 中，有两种主要的渐变类型：线性渐变放射性渐变线性渐变 可用来定义 SVG 的线性渐变。 标签必须嵌套在 的内部。 标签是 definitions 的缩写，它可对诸如渐变之类的特殊元素进行定义。线性渐变可被定义为水平、垂直或角形的渐变： 当 y1 和 y2 相等，而 x1 和 x2 不同时，可创建水平渐变 当 x1 和 x2 相等，而 y1 和 y2 不同时，可创建垂直渐变 当 x1 和 x2 不同，且 y1 和 y2 不同时，可创建角形渐变样例：样例解释： 标签的 id 属性可为渐变定义一个唯一的名称fill:url(#orange_red) 属性把 ellipse 元素链接到此渐变 标签的 x1、x2、y1、y2 属性可定义渐变的开始和结束位置渐变的颜色范围可由两种或多种颜色组成。每种颜色通过一个 标签来规定。offset 属性用来定义渐变的开始和结束位置（样例图）放射性渐变 用来定义放射性渐变。 标签必须嵌套在 中。 标签是 definitions 的缩写，它允许对诸如渐变等特殊元素进行定义。样例：解释： 标签的 id 属性可为渐变定义一个唯一的名称，fill:url(#grey_blue) 属性把 ellipse 元素链接到此渐变，cx、cy 和 r 属性定义外圈，而 fx 和 fy 定义内圈 渐变的颜色范围可由两种或多种颜色组成。每种颜色通过一个 标签来规定。offset 属性用来定义渐变的开始和结束位置。（样例图）3SVG对事件的响应在SVG中，大多数元素(尤其是可视化元素)都具有自己的事件，这是SVG对DOM 的支持最基本的表现。事件的定义是作为元素的属性出现的，这些属性的值是一个子程序或者函数。当事件在一定条件下激发后，与事件相连接的子程序或者函数将被调用。下面的例子说明了如何使用事件的方法。在SVG中，上面的代码显示一个椭圆。其中onclick属性定义了元素ellipse的一个单击事件，并指定事件的处理函数为func()。当用鼠标单击这个椭圆时，函数func()将被调用。SVG支持的事件比较多。对于一般的可视化元素(如形状、文字、路径等)的事件属性有:onfocusin, onfocusout, onactivate, onclick, onmousedown,onmouseup, onmousemove和。Nmouseout；对于文档一级的元素(如元素)的事件属性有:onload, onunload, onabort, onerror, onresize, onscroll和orlzoom；对于实现动画的的元素的事件属性有:onbegin, onend和onrepeat。这些事件都与DOM2的规范一致，如果使用DOM规范，脚本还可以注册自己的特定事件以进行处理。另外，许多事件的可用与否取决于SVG客户端解释程序是否支持这些事件，大多数DOM2的标准事件都是支持的。此外，可能还支持一些额外的事件，如可视化元素与键盘输人有关的