Snap svg 主要对象

最新推荐文章于 2025-07-04 15:16:12 发布

目尽地平线

最新推荐文章于 2025-07-04 15:16:12 发布

阅读量1.7k

点赞数

CC 4.0 BY-SA版权

分类专栏：前端 svg 文章标签： svg Snapsvg

本文链接：https://blog.csdn.net/ruangong1203/article/details/53896147

前端同时被 2 个专栏收录

43 篇文章

订阅专栏

svg

2 篇文章

订阅专栏

本文介绍了SVG中的关键概念，包括Element、Fragment、Matrix、paper及Set等，并解释了它们的作用及如何提升性能。此外还提到了Snap提供的通用方法，类似于jQuery，简化了SVG图形的创建与操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

                    
                        
                    
                    对象概述
Elementsvg规定的元素，提供修改属性、绑定事件、操作数据、操作层级关系、动画等方面的方法，类似jquery选取的元素
Fragment虚拟节点，其用处是可以用js创建多个元素，添加到Fragment，不会影响到实际的DOM，添加完成后一次合并到DOM。这么做可以减少浏览器重绘次数，提高性能。
Matrix变换矩阵。图形的各中变换可以用一个变换矩阵来表示，图形中的各个点和变换矩阵相乘就得到其最终位置，在svg中也是如此。Matrix提供各种变换相关的方法，可以对其进行各种变换，然后将变换结果应用到Element中。Element的transform()方法返回的，就是当前元素的变换矩阵。
paper画布，指<svg>元素,提供创建各种形状的通用方法。
Set附加了一些有用方法的集合
Snap提供一些通用方法，如元素选取、各种转换、扩展插件、滤镜等,类似Jquery的$
mina缓动效果

                

对象	概述
Element	svg规定的元素，提供修改属性、绑定事件、操作数据、操作层级关系、动画等方面的方法，类似jquery选取的元素
Fragment	虚拟节点，其用处是可以用js创建多个元素，添加到Fragment，不会影响到实际的DOM，添加完成后一次合并到DOM。这么做可以减少浏览器重绘次数，提高性能。
Matrix	变换矩阵。图形的各中变换可以用一个变换矩阵来表示，图形中的各个点和变换矩阵相乘就得到其最终位置，在svg中也是如此。`Matrix`提供各种变换相关的方法，可以对其进行各种变换，然后将变换结果应用到`Element`中。`Element`的`transform()`方法返回的，就是当前元素的变换矩阵。
paper	画布，指`<svg>`元素,提供创建各种形状的通用方法。
Set	附加了一些有用方法的集合
Snap	提供一些通用方法，如元素选取、各种转换、扩展插件、滤镜等,类似Jquery的$
mina	缓动效果