配置 draw.io 模板库以使用自定义模板图

如果您在 Confluence 之外使用 draw.io，现在可以通过draw.io 配置中的相应属性自定义模板库templateFile。您可以添加自定义模板，并指定在从模板创建新图表时要打开哪些形状库和自定义形状库。

使用自定义模板库配置时，您可以插入自定义模板（无需打开相关的形状库），或者创建一个新图表来打开已定义的形状库。

配置 draw.io 以使用自定义模板库文件

将自定义模板库文件保存到可公开访问的位置（例如 GitHub），然后将其添加到 draw.io 配置中。

1. 如果您使用的是经典模式，请选择“…”>“设置”>“配置”或“附加功能”>“配置” 。

2. 将该templateFile属性添加到配置中，然后单击“应用”。
   

3. 

4. 单击“确定”，然后重新加载浏览器标签页，使编辑器使用新配置。

5. 选择…>文件>新建，打开您配置的自定义模板库。

请按照以下说明创建您自己的自定义模板库文件。

创建自定义模板库文件

模板库文件是一个遵循特定文件格式的 XML 文件，用于定义模板库对话框中可用的模板图，以及从模板创建新图时打开的任何自定义形状库。

模板库文件格式

<?xml version="1.0"?><templates>
  <clibs name="example">
    <add>Uhttps://jgraph.github.io/drawio-libs/libs/integration/additional_or_support.xml</add>
    <add>Uhttps://jgraph.github.io/drawio-libs/libs/integration/ai_machine_learning.xml</add>
  </clibs>
  <template section="Title" subsection="Subtitle" url="http://example.com/diagram.xml" title="Diagram" name="Tooltip" preview="https://example.com/diagram.png" libs="general;basic" clibs="example" tags="term1;term2" /></templates>

注意：要包含默认的 draw.io 模板，请从我们的模板库文件开始，将所有 draw.io 模板的路径更改为drawio 存储库中原始文件的 URL 。

例如，基本类图模板basic/classes.xml需要是：
https://raw.githubusercontent.com/jgraph/drawio/dev/src/main/webapp/templates/basic/classes.xml。

示例自定义模板库

让我们通过一个示例来逐步了解模板库格式，该示例包含了之前文章中的岩池信息图和自定义形状库。

在模板库文件中，首先定义模板打开的自定义形状库，然后定义模板图。

步骤 1：定义自定义形状库

自定义形状库文件必须存储在可访问的位置，例如 GitHub 存储库中，并使用mxGraphLibrary 文件格式。

我们将使用drawio-diagrams 代码库中的freehand-rockpool-shapes.xml自定义形状库。 注意：请务必点击进入GitHub 上的Raw 页面，复制该库文件的 URL。

在模板文件中使用标签定义自定义形状库<clibs>（可以有多个）。

• name="..."为每个自定义形状库类别使用唯一的标识符。

• 一个类别可以包含多个自定义形状库子类别。将每个自定义形状库文件的 URL 用 <code><add>标签括起来，并在 URL 前加上一个句点U。

示例：在模板库中定义自由手绘岩池形状自定义库。

<clibs name="freehand">
  <add>Uhttps://raw.githubusercontent.com/jgraph/drawio-diagrams/dev/blog/freehand-rockpool-shapes.xml</add></clibs>

步骤二：定义模板图

<template>在外层标签内添加一个新标签<templates>，并列出库中的模板。

每个模板都必须具备这些属性。

• 添加section="..."名称即可将模板归入相应类别。

• 添加url="..."作为自定义模板的图表文件。

• 添加一个title="..."描述图表的内容。

以下属性为可选属性。

• subsection="..."如果要将模板放置在子类别中，请添加 a 。

• 添加一个按钮name="..."，当鼠标悬停在模板预览上时，显示描述性工具提示。

• 添加preview="..."图表的 .png 图片的 URL，以便在放大镜预览功能中显示。

• tags="..."以分号分隔的列表形式添加。

示例：将 drawio-diagrams 存储库中的岩池信息图添加为自定义模板：

  <template section="Infographics" 
      url="https://raw.githubusercontent.com/jgraph/drawio-diagrams/dev/blog/infographic-rockpool.drawio" 
      preview="https://raw.githubusercontent.com/jgraph/drawio-diagrams/dev/blog/infographic-rockpool.png" 
      title="rockpoolInfographic" 
      tags="infographic;freehand"/>

步骤 3：默认打开形状库

您可以配置形状库，以便在 draw.io 中从模板创建新图表时，形状面板中自动打开形状库。

内置形状库：在模板定义中添加libs="..."属性，作为 draw.io 中内置形状库的分号分隔列表。

自定义形状库：将属性添加clibs="..."到标签中，作为以分号分隔的列表，该列表可以是您在此文件开头的标签<template>中定义的名称，和/或自定义形状库文件的编码 URL。<clibs>

例如：岩池信息图模板打开在模板库文件开头定义的自由手绘形状自定义库和内置的信息图形状库。

  <template section="Infographics" 
      url="https://raw.githubusercontent.com/jgraph/drawio-diagrams/dev/blog/infographic-rockpool.drawio" 
      preview="https://raw.githubusercontent.com/jgraph/drawio-diagrams/dev/blog/infographic-rockpool.png" 
      title="rockpoolInfographic" 
      libs="infographic" 
      clibs="freehand" 
      tags="infographic;freehand"/>

自定义 draw.io 模板库文件

我们还将包含两个原始基础模板——类图和流程图。自定义模板库文件现在如下所示：

有关的

draw.io 中用于 Confluence Cloud 的自定义模板库

draw.io for Confluence Cloud 使用您实例中的 draw.io 配置空间来组织和共享自定义模板。

了解管理员如何设置和管理这些自定义模板图。

搜索自定义模板

您可以使用标签和标题搜索模板图表。例如，搜索freehand“rockpoolinfographic custom template”将返回该模板。