【乐吾乐2D可视化组态编辑器】连线

1 连线的绘制

1.1 钢笔绘制连线

1.1.1 曲线、线段、直线、脑图曲线

开始:单击左键

暂停:单击右键 或 enter

结束:esc

乐吾乐2D可视化组态编辑器demo:https://2d.le5le.com/

1.1.2 横线

按下快捷键shift,点击鼠标左键绘制,右键结束绘制(连线类型选择直线)

1.1.3 竖线

按下快捷键ctrl,点击鼠标左键绘制,右键结束绘制(连线类型选择直线)

1.1.4 斜线

连线类型选择直线,选择钢笔,鼠标左键点击绘制起点,按住快捷键ctrl+shift,鼠标移动角度(以15°为递增角度),左键单击绘制第二个点,右键结束绘制

1.2 连接绘制连线

1.2.1 曲线
1.2.2 线段
1.2.3 直线
1.2.4 脑图曲线

2 连线变节点

连线变成节点、节点变成连线:右键

3 切割/合并连线

切割连线:选中线,移入线锚点,按下 S

合并连线:线连接线时,按下 alt

4 连线样式

设置连线的外观样式:

线条样式:实线、虚线

连线类型:曲线、折现、直线

连接样式:斜角、圆角、默认

线条渐变:无、线性渐变

线条颜色、浮动颜色、选中颜色

线条宽度

背景:纯色背景、线性渐变、径向渐变

背景颜色、浮动背景颜色、选中背景颜色

透明度:0-1

锚点颜色、锚点半径(≥0)

阴影颜色、阴影模糊、阴影X偏移、阴影Y偏移

变宽颜色、边框宽度(≥0)

4.1 用连线绘制管道

方式一:线性渐变外观

外观--线条渐变--线性渐变--线性渐变颜色

案例地址:乐吾乐2D可视化

方式二:连线边框+透明度

案例:用连线丰富的外观属性,绘制武地铁线路图demo

案例地址:乐吾乐2D可视化

起点样式

终点样式

线宽

5 连线动画

动画效果:水流、水珠流动、圆点

动画线宽(≥0),动画颜色,动画速度,反向流动,循环次数

下个动画:tag,自动播放,保持动画状态,线性播放:是/否

案例:连线动画常常用于展示管道水流/能源等流动方向

案例地址:乐吾乐2D可视化

视频教程:用连线绘制管道效果

相关推荐
古夕10 分钟前
第三方 SSO 接入实践:redirect_uri 编码、回调一致性与跨项目联调
前端·vue.js
朦胧之13 分钟前
页面白屏卡住排查方法
前端·javascript
用户5936087414013 分钟前
Playwright 黑魔法:用 ClipboardEvent 绕过 React 富文本编辑器
前端
石山岭44 分钟前
自己动手写了一个 Android 虚拟定位 App:GPSSimulate 技术实
android·前端
犇驫聊AI1 小时前
Chrome DevTools MCP + Claude Code 自定义skills生成接口代码生成器
前端·javascript
kyriewen1 小时前
别再这样写 async/await 了:我在 Code Review 中见过最多的 8 个错误
前端·javascript·面试
hoLzwEge1 小时前
node-linker VS shamefully-hoist
前端·前端框架
袋鱼不重2 小时前
解决 Web 端图片预览与下载颜色不一致的一种工程方案
前端·后端
风止何安啊2 小时前
教你用 JS + AI 实现简单的爬虫,零门槛爬取网页信息
前端
cidy_982 小时前
codebase-memory-mcp 新手完全教程:让 AI 真正「理解」你的代码库
前端