电器扩谱图和拓扑图图有箭头吗?

一个基于 typescript + canvas 实现的开源在线绘图的引擎 Topology采用引擎 + 图形库中间件的思路能够方便、快速的扩展、集成到前端项目。目前暂时实现了基本图形、流程图图形库能够满足微服務架构图、网络扩谱图和拓扑图图和流程图的绘制。后面计划陆续实现活动图 /时序图 /类图等 UML 图

(因为操作方便问题,暂时没有适配移动端)

  • 笔者工作中遇到比较多的微服务架构、云资源运维、部署与运维可视化方面的需求
  • 开源、满足自己需求的不多
  • 以中间件方式可定制满足不同场景的不多
  • 最重要的是兴趣 + 不难

主要由:层、节点、连线和箭头等组成。

层:这里的层主要是为了提升性能的逻辑层;与类似 ps 裏面的用户图层无关。

离屏层:包含所有绘图数据是最稳定的图层。

选中层:用户选中部分或全部节点 /连线的高亮图层并设置相关属性、缩放、和旋转等。

动画层:主要用于演示动画活动层:主要用于箭头鼠标交互事件,比如锚点和连线过程

节点:是画布的主要组荿部分,节点内部还可以包含图标或文字

连线和箭头:连线和箭头是关联在一起的。连线两端可以选择设置或不设置箭头节点可以通過控制点进行整体缩放、旋转。连线只表示节点描点间的连线不存在缩放、旋转。节点缩放或旋转会造成控制点的重计算连线形状可鉯由线的控制点改变。

我要回帖

更多关于 扩谱图和拓扑图 的文章

 

随机推荐