Vue实现Antv/X6中的示例,以及一些er图开发场景

news/2024/7/9 23:40:59 标签: 前端, javascript, vue

通过Vue实现Antv X6中的示例,以及一些开发场景,代码已经丢到仓库里了。

  • lwstudy/antv-x6-vue-demo: Vue实现Antv X6中的示例,以及一些开发场景 (github.com)
  • learn-antv-x6: antv/X6学习 (gitee.com)

介绍

使用脚手架(自动生成接口、路由)实现一些x6在vue2中的实例写法
已实现ER、 BPMN、 UML、 思维导图、 自定义功能

ER图—完善为db数据库图表

请添加图片描述

ER图—er图增加布局等

在这里插入图片描述

ERV2图—x6-V2.x

  • 增加tooltip
    在这里插入图片描述

  • 增加右键菜单
    在这里插入图片描述

  • 全屏处理
    在这里插入图片描述

  • 一对多自定义连线
    在这里插入图片描述

  • 画布移动与节点选择切换

  • 大数据量demo测试(配合可视化区域内节点可以在3000个节点时依然能够操作)

  • 仅加载可视化区域内的节点

  • 对应dberv2中的register.js中有箭头适配的实现法

BPMN图—实现当前节点和通过节点的高亮,以及驳回边的智能处理

在这里插入图片描述

拖拽绘制BPMN图(Stencil基于dnd拖拽封装的插件实现UI组件)

在这里插入图片描述

UML图

请添加图片描述

思维导图

请添加图片描述

vueshape_57">自定义流程图(vue-shape)

请添加图片描述

vueshape_60">自定义散点图(vue-shape)

请添加图片描述

vueshape_62">散点关系图谱(vue-shape)

请添加图片描述

circle关系图谱(内置shape)

请添加图片描述


http://www.niftyadmin.cn/n/4989668.html

相关文章

200 套基于Java开发的Java毕业设计实战项目(含源码+说明文档)

文章目录 简介前言第一部分第二部分部分截图源码咨询 简介 博主介绍:✌程序员徐师兄、7年大厂程序员经历。全网粉丝30W、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 前言 对于java方向的毕业设计题目选题&#xf…

Python bug: TypeError: unhashable type: ‘dict‘ or ‘list‘

Python bug: TypeError: unhashable type: ‘dict‘ or ‘list’ 经过排除,发现我遇到的错误是由于字典的键使用了【字典】或【列表】变量。 由于有时候会将一些变量赋值给字典,通常键的名称直接使用变量名称,但有时不小心键的名称没有变成字…

阅读笔记篇卷首语

2023年8月31日,周四晚上 我决定开设这个专栏, 因为我知道有些文章可以改变人生,值得去细读。

MYSQL 高级SQL语句

1、按关键字排序: order by 语句用来实现 ,前面可以使用where字句使查询结果进一步过滤 asc 是按照升序排序 , 默认的 desc 是按照降序排序 order by的语法结构 例:select name,score from ku order by score desc; 表示将数…

DBMS Scheduler设置重复间隔

参考文档: Database Administrator’s Guide 29.4.5.2 Using the Scheduler Calendaring Syntax The main way to set how often a job repeats is to set the repeat_interval attribute with a Scheduler calendaring expression. See Also: Oracle Database…

如何高性能、高效率地实现3D Web轻量化?

随着互联网和Web技术的发展,3D Web应用的需求越来越多。然而,复杂的3D模型在Web上展示 和交互通常需要大量的带宽和计算资源。 为了解决这一问题,HOOPS技术作为一套专业的3D图形技术开发工具包,发挥着关键作用。本文 将探讨HOO…

C#-单例模式

文章目录 单例模式的概述为什么会有单例模式如何创建单例模式1、首先要保证,该对象 有且仅有一个2、其次,需要让外部能够获取到这个对象 示例通过 属性 获取单例 单例模式的概述 总结来说: 单例 就是只有 一个实例对象。 模式 说的是设计模式…

自动化方案不合理的原因浅析

前言 一直以来,测试团队都面临一个迫在眉睫的问题:自动化测试收效甚微,甚至被认为是”为了实现自动化而自动化“。之前写过一篇博客自动化测试的评价维度,其实自动化的评价不乏有其他的评价指标。但这里想说的一点是,自…