搜索内容：
时间：2017-10-10
编辑:网站制作公司
1964
1
SVG,即”可伸缩矢量图形”,是一种用来描述2D图形的XML标记语言。它是W3C推荐标准，旨在与CSS和DOM等其他W3C标准一起工作。近年来，它在网络上取得了长足的进步，并被广泛地纳入了一系列项目类型中。
下面是一些工具的列表，这些工具可以极大地提高你在SVG和web上的工作流程。有很多这样的工具，以下这些是我最喜欢的。
1.矢量软件
任何向量编辑和创建软件最终都是一个SVG工具，有几个可供选择。让我们看看3个顶级工具。
头一个当然是Adobe Illustrator。Adobe插画是一个非常强大的矢量图形软件，广泛应用于许多行业。随着SVG在网络上的兴起，它作为SVG工具的效用大大增加了。但是这是有代价的。如果图形是你的东西，而且你使用SVG是很重要的，那么可以投资一些资金。
Corel Draw，是Corel家族的设计产品成员，是一个非常有能力的工具。在图形领域，Corel一直是Adobe的竞争对手，但随着Adobe在许多其他软件领域(包括网络)的主导地位，Corel似乎处于次要地位。
世界各地的许多平面艺术家依然对它发誓，但如果你的兴趣仅限于SVG，那它可能不是你的首选软件。它毕竟是有自己的价格标签的。
如果没有一个很好的老开源工具，矢量软件的列表当然是不完整的，现在能在Google的代码驱动中找到它。SVG- edit是一个开源、快速、基于web的SVG编辑器。它是基于JavaScript的，适用于任何现代浏览器。
这款软件是免费的。对于想要在视觉上创建图形并输出SVG代码的开发人员来说，这是一个完美的解决方案。
2.用于编写SVG脚本的SVG库
在事物的视觉方面，SVG是一组形状、笔画、颜色和作品，在屏幕上以视觉方式分组和输出。然而，任何SVG文件实际上都可以在文本编辑器中打开，这就是可以看到SVG内部工作原理的地方。
在开始使用内联SVG的教程中，我详细介绍了在文档中直接编写SVG来生成屏幕上的输出。然而，有一些库简化了SVG脚本编写，并简化了交互性。让我们来看看其中的两个。
SnapSVG是我最近最喜欢的用于与SVG合作的库，它能快速启动并运行。根据他们的说法，这是一种创建交互式、独立于任何屏幕大小的独立矢量图形的好方法。
我完全同意这种说法。这个库有很好的文档记录，有大量的特性和方法，还有一些演示供您细阅。他们的入门指南很容易理解，而且会让你的脚保持湿润，让你的想法流畅起来。例如，创建一个圆圈就像这样简单:
输出将是一个半径为100px的圆，x和y坐标从SVG原点到150PX. 设置属性也非常简单，如上所示。圆圈的动画也很简单:
这将使圆的半径在1秒内线性增加到50px。我有没有提到提前附带一系列宽松政策功能?
像SnapSVG这样的RaphaelJS是一个JavaScript库，它的任务是让您的SVG工作流轻松起来。它在他们的站点上也有很高的记录，有很多演示可以窥视源代码，并获得一些可能性和内部工作的想法。
它的安装和使用也很容易掌握。为了创建与上面相同的圆，我们要这样做:
如你所见，这是一个非常类似于Snap SVG的语法!正如您所期望的那样，动画这个循环同样简单:
看，和SnapSVG一样，Raphael也有自己的一组宽松功能。
3.SVG优化工具
如果你在选择的任何图形软件中创建SVG，然后在操作或输出之前将其放入文档中，建议首先优化您的文件。
大多数图形软件输出SVG与一堆不必要的激动的页面,增加重量和整体超额行李。这里有一些工具可以帮助你开始学习。
SVGO是是一个基于nodejs的工具，它通过命令行运行，以大量函数打包。它可以清理属性、删除注释、删除元数据、将颜色从一种字符串格式转换成另一种格式，甚至可以缩小您的SVG代码。
这是我的选择工具，使用方法就像调用svgo一样简单:
如果NodeJS和命令行不是你的东西，你一定要检查Peter Collingridge的基于web的SVG optimiser工具。它并没有像SVGO那样打包完整的特性，但更适合简单的文件。
结束
我们在本文中看到的只是对我们可用的SVG工具表面的一种接触。我是Adobe Illustrator的长期用户，所以这是我选择的工具。Snap SVG也是我编写SVG的首选库，在我看来，SVGO是不可战胜的。但这并不能使他们成为所有人的选择。这一切都归结于偏好，所以尝试所有的方法，并建立一个适合你的工作流程!
3
s后返回登录
3
s后返回登录
