1. 适用的 drawio 版本
单机版 drawio,带有配置
选项的单机版本
2. 配置使用方法
点击配置,将json代码复制到弹窗中,点击应用即可。
如果代码有错误,将无法应用
3. 相关json代码
官方json配置参考:https://www.diagrams.net/doc/faq/configure-diagram-editor
1. 色板配置、字体配置
有快捷的配置网站:https://drawio-config.herokuapp.com/ 开发者的github网址:https://github.com/leifmarcus/drawio-config
Preset Colors
色板预设颜色Color Schemes
预设样式
包含填充颜色、边框颜色、阴影颜色、字体颜色Custom Fonts
字体预设
即:drawio字体选择列表显示的可选择的字体
字体设置可以看:这里Default Edge Style
边缘的默认风格Default Vertex Style
连接线的默认风格
配置同上
2. 额外的配置
这些配置找不到快捷配置的网站,只能自己手动配置
最外层的大括号也是 drawio 最外层的大括号
记得添加这些项之前,先在原来项的最后加一个逗号
1. 自动保存 autosaveDelay
Defines the delay (in ms) between the last change and the autosave of the file
文件改动后 XXX 毫秒自动保存
{
"autosaveDelay": 300
}
2. 界面ui
以下均为 CSS 代码,在 AAA 部分添加要修改的 css 代码,然后将整体复制到 配置当中
注意要将所有要配置的代码全塞到AAA一个值里,不能有换行符
{"css": " AAA "}
- 菜单栏和标题栏颜色
geMenubarContainer
标题栏颜色设置为 c0c0c0
.geMenubarContainer { background-color: #c0c0c0 !important; }
geMenubar
菜单栏颜色设置为 c0c0c0
.geMenubar { background-color: #c0c0c0 !important; }
- 界面全局字体设置
.geEditor td
和.geTempDlgSearchBox .geTempDlgFooter .geTempDlgBack .geTemplatesLbl .geTemplateCatLink .geTempDlgNewDiagramCatLbl .geTempDlgShowAllBtn .geTempDlgNewDiagramCatItemLbl .geTempDlgDiagramsListTitle .geTempDlgRadioBtn .geTempDlgDiagramTileLbl
字体显示太多了,需要设置很多地方 - 和
- 字体选择的逻辑:根据 font-family 值的顺序,先查找排在前面的字体,若此字体不存在 或 不能显示这个符号,则使用下一个字体
- 在 AAA 处添加要自定义的字体
- 如果字体名称有空格,要用双引号
"
括起来 - 如果有多个字体,字体之间用英文逗号
,
分隔 - 其他字体是系统默认字体,建议不要删,因为涉及到其他文字、emoji表情等其他文字的显示,否则要保证你加入的文字能兼顾所有文字符号的显示
- 加入配置界面的json代码中时,要注意上面的 css 代码中的英文双引号要转义。即将
"
转换为\"
.geEditor,td { font-family: -apple-system, BlinkMacSystemFont, AAA,"Segoe UI Variable", "Segoe UI", system-ui, ui-sans-serif, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji" !important;}
.geTempDlgSearchBox .geTempDlgFooter .geTempDlgBack .geTemplatesLbl .geTemplateCatLink .geTempDlgNewDiagramCatLbl .geTempDlgShowAllBtn .geTempDlgNewDiagramCatItemLbl .geTempDlgDiagramsListTitle .geTempDlgRadioBtn .geTempDlgDiagramTileLbl { font-family: AAA, Helvetica !important;}
3. 其他设置
这些设置直接写json格式的键值对,加入设置的json代码中即可。
thumbWidth/thumbHeight
左侧面板的宽/高。(6.4.5 及更高版本可以设置)
Defines the width and height for the entries in the left panel (6.5.4 and later).
sidebarWidth
右侧面板的初始宽度。
Specifies the initial width of the sidebar.
sidebarTitles
右侧面板是否显示标题。
Specifies if titles in the sidebar should be visible. Default is false.
sidebarTitleSize
右侧面板的标题的字体大小。默认值是 8 。
Specifies the font size in pt for titles in the sidebar. Default is 8.
zoomWheel
鼠标滚轮是否用于放大缩小操作。默认值是 false (否)。(15.0.6 及更高版本可以设置)
Specifies if the mouse wheel is used for zoom without any modifiers (true/false, 15.0.6 and later). Default is false.
zoomFactor
鼠标滚轮滚动一次的缩放比例。默认是 1.2。
(14.7.0 及更高版本可以设置) Defines the zoom factor for mouse wheel and trackpad zoom. Default is 1.2 (14.7.0 and later).
darkColor
定义暗黑模式下的背景颜色。默认值是 #2A2A2A。
Defines the background color for dark mode. Default is #2A2A2A.
lightColor
定义亮色模式下的背景颜色。默认值是 #F0F0F0。
Defines the foreground color for dark mode. Default is #F0F0F0.
pageFormat
定义默认的页面尺寸。(15.0.0 及更高版本可以设置)
Defines the default page format, eg. “pageFormat”: {“width”: 1169, “height”: 1654} for DIN A3, with inches * 10 for width and height (15.0.0 and later).
gridSteps
定义网格子网格的数量。
Defines the number of minor grid steps (14.3.2 and later).
simpleLabels
简单的输出label。默认为 ture (启用)。默认启用以label中禁用换行和复杂的格式输出来防止 SVG 输出的安全问题。(14.5.9 及更高版本可以设置)。true - Disables word wrap and complex formatting for labels by default to avoid foreignObjects in the SVG output (14.5.9 and later).
emptyDiagramXml/emptyLibraryXml
(略,看不懂) (6.5.4 及更高版本可以设置)
Defines the XML for blank diagrams and libraries (6.5.4 and later).
defaultEdgeLength
新连接线的默认长度 (7.2.4 及更高版本可以设置)
Defines the default length for new connectors (7.2.4 and later).
defaultPageVisible
默认初始页面是否可见。默认为 true
Defines whether the page is initially visible (true/false).
defaultGridEnabled
网格是否可见。默认为 true
Defines whether the grid is initially enabled (true/false).
autosaveDelay
自动保存时间设置 (单位 ms) (10.4.7 及更高版本可以设置)
Defines the delay (in ms) between the last change and the autosave of the file (10.4.7 and later).
version
自定义版本显示 (7.2.8 及更高版本可以设置)
The current version of the configuration (any string, e.g. “1.0”). If this is different from the last used version, then the current settings on the client-side (.drawio-config) will be reset. The default is null. Change this to force the stored settings in the client to be reset and apply the current configuration (7.2.8 and later).
override
服务器覆盖客户端的设置选项。
Ignores the current settings on the client-side if this is set to true (9.2.5 and later).
globalVars
全局变量。可在整个系统全局使用的全局变量。
Defines global variables for system-wide placeholders using a JSON structure with key, value pairs. Keep the number of global variables small.
compressXml
压缩drawio的xml文件。xml文件压缩后,需要用。
Specifies if the XML output should be compressed. The default is true (false for Confluence Cloud).
includeDiagram
:
导出数据时默认包含的图形。
Specifies the default for including diagram data in export dialogs (15.0.4 and later).
dataGovernance
数据监管,用于 US 或 EU 地区。如果lockdown = true
此选项被忽略。
Set the server endpoint region. The default is to use your closest region, (either EU or US). If lockdown is set to true, dataGovernance is ignored.
lockdown
锁定。断开 drawio 服务器客户端的连接。默认为 false
Disable data transmission, apart from directly between your browser and your selected data storage location. Default is false.
maxImageBytes
图片大小的限值。单位 Byte。默认为 1000000 Byte (976.6KB)
Defines the maximum size for images in bytes. Default is 1000000.
maxImageSize
图片最大尺寸。默认最大尺寸为 520 x 520。
Defines the maximum width or height of the image, where the lowest value is used. Default is 520.
oneDriveInlinePicker
onDrive 云盘是否使用 drawio 内建的文件选择器。
Specifies if the inline picker for OneDrive should be used. Default is true if inlinePicker URL parameter isn’t used.
settingsName
设定用户配置的名称,一般用于嵌入模式。本地存储的用户配置文件名为.{配置名称}-config
Specifies a name for storing user settings, usually in embed mode, in the form .{name}-config, in local storage.
shareCursorPosition
多人协同时,分享各个用户的鼠标位置。默认为 true
Specifies the default value for shared cursors in real-time collaboration. Default is true.
showRemoteCursors
多人协同时,展现远程其他用户的鼠标位置。默认值为 true
Specifies the default value for showing remote cursors in real-time collaboration. Default is true.