成都网站制作公司科蓝,单页面应用优化,如何收集网站建设资料,网站建设卩金手指科杰文章目录 一、基础操作1、链接2、等比例变形3、复制4、插入表格 二、在线打开三、插入—功能聚集地1、插入图片2、插入画笔3、插入布局4、导出 四、图码转换——高效画图1、通用图码转换2、流程图生成#xff1a;使用mermaid语言生成图#xff1a; 五、图码转换高效画图的典型… 文章目录 一、基础操作1、链接2、等比例变形3、复制4、插入表格 二、在线打开三、插入—功能聚集地1、插入图片2、插入画笔3、插入布局4、导出 四、图码转换——高效画图1、通用图码转换2、流程图生成使用mermaid语言生成图 五、图码转换高效画图的典型用法1、批量修改所有的字体/线条—常用功能2、大模型生成流程图mermaid语言画图代码—高可用3、大模型生成mxGraph 库画图代码—低可用六、Diagrams 库其他1、将内容在html打开2、输入数学公式 一、基础操作
1、链接
1.1、自动连接图形 鼠标放在图形上点击出现的箭头会自动出常用图形 1.2、两种连接类型 1、固定连接 如果拖动其中一个图形的话固定链接的形状会是曲线连过去。 方法不要点击左边图形鼠标放在边框上面左边出现绿圆点鼠标左键点击图形的绿圆点不放拖动链接另外一个图形的绿圆点。 2浮动连接 如果拖动其中一个图形的话固定链接的形状会自动变为直线连接。 实现方法1鼠标放在图形边缘等待出现蓝色箭头鼠标左键点击图形上的箭头不放拖动链接到另外一个图形再往前靠一点另外一个图形会变成蓝框松手。 实现方法2将两个图形靠近点箭头自动连过去。 2、等比例变形
shift小蓝点
3、复制
ctrld 快速复制 ctrl拖动鼠标 快速复制 ctrlc/v 复制粘贴
4、插入表格
点击表格图标选择插入图表形状。 点击第二张图中红圈的黄点改变成图标的形状。 在右边的设置框里调整图表的大小 二、在线打开
https://app.diagrams.net/
三、插入—功能聚集地
1、插入图片
调整图形—插入—图片 2、插入画笔
插入—自由绘图
3、插入布局
4、导出
使用draw.io导出的png或者svg等均含有xml信息占用存储较大但是可以再次导入draw.io进行编辑。
四、图码转换——高效画图
可以和大模型结合由大模型生成代码人工修改代码或图形高效画图。
draw.io支持mxGraph的标记语言Markup Language用于在draw.io中描述图形模型的结构和属性。mxGraphModel是draw.io内部使用的一种格式用于保存和加载图形模型数据。
1、通用图码转换
功能启用
1、点击 其他—编辑绘图 2、弹出代码框
2、流程图生成使用mermaid语言生成图
插入 — 高级支持插入txt、mermaid、sql、csv等格式的内容 五、图码转换高效画图的典型用法
这是个代码框用于调用mxGraphModel的标记语言Markup Language在draw.io中描述图形模型的结构和属性。mxGraphModel是draw.io内部使用的一种格式用于保存和加载图形模型数据。
1、批量修改所有的字体/线条—常用功能
draw.io并没有提供全部选择一类对象如线条、字体然后修改的功能。可以通过图形生成代码然后修改对应的代码来快速完成。
其中代码修改可以由大模型修改代码然后再讲代码粘贴回draw.io中修改。
2、批量插入图形 这是drawio的绘图语言请在其中插入一个菱形
注意插入的图像代码要放在倒数第二行 前。
mxGraphModel dx977 dy588 grid1 gridSize10 guides1 tooltips1 connect1 arrows1 fold1 page1 pageScale1 pageWidth827 pageHeight1169 math0 shadow0rootmxCell id0 /mxCell id1 parent0 /mxCell id5TlSNR0lOvDpRwltdClC-1 value stylerounded0;whiteSpacewrap;html1; parent1 vertex1mxGeometry x200 y280 width120 height60 asgeometry //mxCell/root
/mxGraphModel2、大模型生成流程图mermaid语言画图代码—高可用
流程图mermaid语言画图代码相对简单大模型可以较好的生成
3、大模型生成mxGraph 库画图代码—低可用
代码生成的mxGraphModel画图代码Bug较多基本无法运行。
Prompt
使用mxGraphModel的标记语言在draw.io画一个网络图其中包含3个思科交换机和一个网关交换机都连接到网关上。请生成代码,其中交换机对象使用为xx
这个对象ID可以选一个交换机到画布然后查看代码获取。一般在这一句styleshapemxgraph.cisco.directors.content_engine_(cache_director)
六、Diagrams 库
diagrams 库可以用来画架构图。画好的图片可以插入draw.io或者生成xml导入draw.io。
安装 Diagrams库依赖于开源的图可视化工具Graphviz安装Graphviz后通过pip 安装diagrams。
pip install diagrams安装 graphviz2drawio库 将保存的graph转为xml然后在drawio中导入。
from graphviz2drawio import graphviz2drawioxml graphviz2drawio.convert(graph_to_convert)
print(xml)其他
1、将内容在html打开
注意实际内容和菜单是反的嵌入图片是网页嵌入网页是图片。 1、文件—嵌入——图片/SVG。 会生成代码将代码复制到txt该后缀为html则会在页面打开点击打开的页面上的图形则会在网页中呈现。 2、1、文件—嵌入——图片。 会生成代码将代码复制到txt该后缀为html则会在页面打开页面上会有一个图形。
2、输入数学公式
1、打开 其他—数学排版 2、点击插入文本框 3、在文本框中输入公式 a^2b^2c^2 注意单引号要用键盘Tab 上面的键输入(即ESC键下面TAB键上面的~和单引号键)。 4、点击空白文本框自动渲染为数学公式。