SVG教程
https://m.runoob.com/svg/菜鸟教程'SVG 教程'..https://m.runoob.com/svg/
1、SVGO
1.1 konw是什么
用于优化SVG文件的Node.js库和命令行应用程序。
SVG文件,特别是那些从矢量编辑器导出的文件,通常包含大量冗余信息。这包括编辑器元数据、注释、隐藏元素、默认值或次优值,以及其他可以在不影响呈现的情况下安全地删除或转换的内容。
1.2 how怎样用
具体见官方文档: svgo官方开源地址
2、JavaScript-Clipper.js
JavaScript-Clipper.jshttps://www.cnblogs.com/zhigu/p/11928492.html
https://www.cnblogs.com/zhigu/p/11928492.htmlhttps://www.cnblogs.com/zhigu/p/11928492.html
自相交的多边形:
自己的边与自己相交的多边形,比如五角星就是一种自交多边形,一般来说我们认为多边形的边应该是顺时针或者逆时针将多边形的点连起来,但有的多边形的边可能会连的比较不符合这个规律,就出现了自交多边形。
3、SVG元素碰撞检测,即交叉重叠
突破编程_前端_SVG(元素碰撞检测)_svg碰撞检测-CSDN博客
4、多边形偏移算法(膨胀或收缩多边形算法)
特别提醒:多边形偏移(Offset)与缩放(Scaling)是两个不同的概念
多边形的“偏移”(Offset)和“缩放”(Scaling)是两个不同的概念,尽管它们在视觉上可能有些相似。下面分别解释这两个概念及其区别:
1. 偏移(Offset)
偏移指的是在多边形的基础上向外或向内扩展一定距离,形成一个新的多边形。这个新的多边形与原来的多边形具有相同的形状,但大小不同。具体来说:
- 向外偏移:新多边形比原多边形大。
- 向内偏移:新多边形比原多边形小。
偏移操作通常用于生成缓冲区(Buffer)或轮廓线(Outline)。在GIS(地理信息系统)和CAD(计算机辅助设计)领域中,偏移操作非常常见。
2. 缩放(Scaling)
缩放是指将多边形按比例放大或缩小。缩放操作通常以某个中心点为基准,将整个多边形均匀放大或缩小。具体来说:
- 放大:所有顶点相对于中心点的距离增加。
- 缩小:所有顶点相对于中心点的距离减少。
缩放操作不改变多边形的形状,只是改变其大小。
区别形状变化:
- 偏移:形状不变,但边界发生了变化。
- 缩放:形状不变,大小发生变化。
中心点:
- 偏移:没有特定的中心点,而是沿着边界向外或向内扩展。
- 缩放:通常有一个固定的中心点作为缩放的基准。
应用领域:
- 偏移:主要用于生成缓冲区、轮廓线等。
- 缩放:主要用于图形的大小调整。
多边形偏移算法 - BimAnthttp://www.bimant.com/blog/polygon-offsetting-algorithm/https://zhuanlan.zhihu.com/p/641536753https://zhuanlan.zhihu.com/p/641536753
5、SVG路径解析svgpath
SVG路径语法的开源解析器,适用于路径数据字符串,而不是完整的SVG XML源。
功能:
(1)创建一个SVG格式的实例
(2)将SVG中所有路径命令转为绝对坐标
(3)提供方法对 SVG 路径进行各种几何变换,如缩放、旋转和平移
用法:链式调用
GitCode - 全球开发者的开源社区,开源代码托管平台
https://github.com/fontello/svgpath.git