学习Inkscape制作矢量图

hbghlyj

wiki
SVG 是一种用于描述二维矢量图形的 XML 标记语言。它是由万维网联盟(W3C)创建的开放标准。我们将使用 Inkscape 有几个原因。首先，它是免费软件。其次，它原生支持 SVG。许多 Linux 发行版都已经安装了 Inkscape。

矩形工具

鼠标拖出一个矩形,会出现手柄(图中B,D),方形手柄(图中D)调整宽和高(W,H),圆形手柄(图中B)做出圆角(Rx,Ry).
窗口顶部工具控制栏(图中C)会根据启用的相应工具箱栏工具而更新.在矩形工具的情况下,它显示W,H,Rx,Ry.
窗口底部中间显示提示消息(图中D),每个工具不仅显示一个提示,提示还会根据您当前执行的工具类型、节点、句柄、对象和编辑进行更新.

如需创建一个正方形,请在单击并拖动时按住 Ctrl 键,此命令键将形成的矩形锁定为正方形或具有整数比率边的矩形.
Ctrl 键对于修改许多其他操作很有用。例如，如果您在移动对象时按住它，它会将编辑方向限制为水平或垂直拉伸。不确定它在特定情况下会做什么？按 Ctrl 或 ⇧ Shift (上档键)并查看屏幕底部中心的状态栏工具提示消息。

椭圆、多边形/星形和螺旋形工具

这些工具与矩形工具类似。使用Ctrl键将限制椭圆工具绘制正圆。让我们看看多边形/星形工具。
您可以通过在工具控制栏上输入数字来更改拐角数、轮辐比、拐角的圆度和随机性。您还可以通过拖动多边形本身的控制点来更改轮辐比。请将数字设置为与下图中显示的相同 - 我们将在本教程的后面部分使用这个圆角三角形。

路径工具

接下来的三个按钮用于绘制路径。路径是一条数学曲线，由路径必须通过的多个点指定。让我们看看第一个，钢笔工具。

以上是贝塞尔曲线的示例。您可以在此视图中看到两个节点。这些是曲线的起点和终点。但是还有其他节点是您看不到的。这些决定了端节点之间的线如何弯曲。要查看这些节点，您需要单击节点按钮。

单击节点工具会显示曲线中间的一个节点。然后单击这个节点，您将看到 Bezier 手柄出现:

这些手柄允许您更改端节点之间曲线的形状。请注意，节点工具列表出现在顶部。您可以使用这些来更改节点。在本入门教程中，我们不会详细介绍这些工具。 节点工具可用于使用其他工具创建的所有对象以显示其节点。

其他两个绘图工具也创建路径。中间的是铅笔工具。计算机将为您计算所有节点和贝塞尔曲线。可以通过绘制一个循环来创建闭合路径（使用钢笔工具，单击起始节点以闭合曲线）。 该组中的最后一个工具是书法工具。它允许您进行书法写作。这支笔以逼真的笔尖方式创建闭合路径。正因为如此，许多图形艺术家一直喜欢用这支笔画画。

选择工具

该工具允许您选择对象、调整它们的大小和移动它们。如果您使用选择工具在对象上单击两次，则手柄会发生变化，您可以旋转对象。

缩放工具

这个工具看起来像一个放大镜。使用该工具拖选某个区域上可将其放大。按 Shift 并单击可再次缩小。

文本工具

看起来像字母 A。单击要输入文本的位置，然后开始输入！如果字母太小，请单击选择按钮，然后拖动手柄使其变大。您可以对文本执行很多操作。

连接器工具

使用它来绘制两个对象之间的连接。例如，图形和标签。
使用此工具的好处是，如果您决定在画布上移动对象，连接器仍会保持连接。

渐变工具

单击并拖动对象，您将创建从全色到全透明的渐变。

拾色器工具

使用此工具对屏幕上的颜色进行采样。

hbghlyj

上标和下标
riptutorial.com/svg/example/10311/super--and-subscript
不要用baseline-shift, 没有浏览器支持此属性, 见MDN的Browser Compatiblity

Note: This property is going to be deprecated and authors are advised to use vertical-align instead.

也不要用vertical-align, SVG的<text>元素不支持此属性.
可以用dy来平移坐标. 注意:<tspan>设置了dy以后, <text>的子元素中, <tspan>后面的元素也会跟着平移, 所以需要在后一个元素设置相反的dy
最方便的解决方案是在Inkscape中设置baseline-shift:super以后用Path>Object to path工具把文本转换为路径.

hbghlyj

hbghlyj 发表于 2022-8-14 17:15
...
可以用dy来平移坐标. 注意:<tspan>设置了dy以后, <text>的子元素中, <tspan>后面的元素也会跟着平移, 所以需要在后一个元素设置相反的dy

例如维基百科Nucleic Acid条目的SVG的H2N <text x="343.03" y="-11.61">     H     <tspan dy="4" font-size="18.9">2</tspan>     <tspan dy="-4">N</tspan> </text> 复制代码

hbghlyj

圆/椭圆工具, 在工具控制栏上输入数字来更改w(或h)时, 左下角不变, 圆心会变.
而在XML编辑器更改 r (或rx, ry)时, 圆心不变(cx,cy).