开源绘图神器draw.io快速入门(中)

发布时间 2023-09-01 17:07:45作者: 磁石空杯

3 文本和连接器

本章内容

  • 拖动连接器连接形状
  • 同时创建新形状和连接线
  • 拆分连接以添加新形状
  • 在图形、画布和连接器上插入文字

3.1 输入文本

添加一个圆角矩形。插入形状后,可以直接键入文字。之后可以单击或双击形状,输入文本。要更改形状内文本的位置或格式,请使用右侧格式面板的文本选项卡。通过调整文本选项卡底部的间距,可以精确设置文本的位置。

您还可以在绘图区域自由放置文本。双击图表中的空白区域,然后从形状选择器中选择文本选项。

文字大小、字体和颜色可在格式面板的 "文字 "选项卡中更改。双击文本可在格式面板中获得增强的文本选项。

在自由文本区域或连接器上按Enter键,手动将文本分成多行。

3.2 连接

点击已选或未选(当鼠标悬停在形状上时)矩形的蓝色箭头,打开draw.io形状选择器。选择左上角的形状,1:1 复制原始形状(或使用通用形状库中最常用的形状)。形状及其内容将被复制,并相连。

现在,在矩形的底部添加另一个形状,但这次我们添加的是杂项库中的双圆形状。将该形状拖放到矩形底部的蓝色箭头上,即可同时添加和连接该形状。

您也可以从未选定的形状中绘制连接器。将鼠标悬停在刚刚添加的双圆形状上,可以看到蓝色的连接小十字。单击并拖动连接器到另一个对象的连接点 - 连接点必须位于绿色圆圈中,这样才能正确连接两个形状。一旦创建了连接器,它就不会从这些连接点上移动。

您可以将连接器连接到边缘(而不是单个连接点),方法是将连接器拖到目标形状上,直到轮廓变为蓝色。当形状在绘图区域移动时,连接器可能会在该边缘上移动。

您也可以用同样的方法从蓝色大箭头上绘制连接器。

3.3 分割连接器

要在两个相连的形状之间插入一个形状,只需将您选择的对象拖放到连接器上,并在看到周围出现紫色轮廓后松开鼠标即可。

双击要添加文字的连接器,然后开始输入。如果需要,可以使用黄色菱形来调整文字的位置。在文本上单击一到两次,覆盖整个文本,或者再单击一次,只编辑文本的部分内容。您可以使用与编辑和格式化文本形状相同的面板来修改文本。

参考资料

4 喝茶实例

4.1 Shape准备

  • cloud
  • cylinder
  • user
  • ellipse
  • callout
  • coffee

4.2 画图

  • 导出

5 云IDE实例

PlatformIO是一个开源的跨平台物联网(IoT)开发生态系统,它提供了一个集成开发环境(IDE)和命令行工具,用于开发嵌入式系统和物联网设备。其主页参见https://platformio.org/,上面有一个云IDE的图,如下:

请使用Draw.io绘制中文版