请问一下vue3怎么实现两个div连线哎，简单连线倒是没啥问题 但是下面这样的效果是怎么做的哎
像这样的效果：https://www.figma.com/file/6rdiVWwYlicb7TsCyew74b/Untitled?node-id=0%3A1&t=SsAGi1Yktcu2QH6z-0
期待佬，别灌水
实现多个div连线功能
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
分享- 邀请回答
-
4条回答 默认 最新
杨同学* 2022-11-25 16:07关注用css+html实现吧,或者用echarts也可以的
参考一下,希望有帮助vue+jsplumb 实现连线绘图_qq_37656005的博客-CSDN博客_vue实现连线题 vue+jsplumb 实现连线绘图jsPlumb是一个比较强大的绘图组件，它提供了一种方法，主要用于连接网页上的元素。在现代浏览器中，它使用SVG或者Canvas技术，而对于IE8以下(含IE8)的浏览器，则使用VML技术。效果图安装npm install jsplumb --savemain.js 引入import jsPlumb from 'jsplumb'Vue.prototype.$jsPlumb = jsPlumb.jsPlumb示例代码<templathttps://blog.csdn.net/qq_37656005/article/details/119673767
vue3：尝试使用jsplumb实现拖拽连线的功能-Web前端之家https://jiangweishan.com/article/vuejs20220330a1.html
js+css实现两个dom元素之间的连线_喯啵儿灞的博客-CSDN博客_js连线 刷论坛时，看到有小伙伴提问不依赖图形化工具，怎么实现两个div之间的连线，看着追问的人不少，顺题发挥了下，下面代码实现两个dom元素中心坐标的连线，首先引入jquery（任意版本），主要是为了方便dom操作，当然改成原生js也可以<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width本回答被题主选为最佳回答 , 对您是否有帮助呢?评论 打赏解决 1无用举报 分享
- 2022-11-25 15:42回答 4 已采纳 用css+html实现吧,或者用echarts也可以的参考一下,希望有帮助 vue+jsplumb 实现连线绘图_qq_37656005的博客-CSDN博客_vue实现连
- 2019-03-19 16:03回答 2 已采纳 背景写成半透明 background: rgba(255, 255, 255, 0.4);
- 2018-07-23 03:39回答 3 已采纳 [拖动并且保存位置](http://www.w3dev.cn/download/20090623/drag-save-position.aspx "")
- 2020-11-23 01:01weixin_39944146的博客 GPS的原理简单说就是从监测站发射电磁波，计算卫星接收信号所用时间然后乘以光速，求出一个伪距离，一般是4颗卫星定位一点列出4个点或者更多解方程，解出x,y,z 就是该点坐标当然这些都是我们不需要关心的，我们这里...
- 2020-03-05 19:45回答 3 已采纳 可以用jquery中 toggle() ，参考下https://www.w3school.com.cn/jquery/event_toggle.asp
- 2018-09-14 16:14回答 1 已采纳 将对象放入数组，调用sort方法就可以排序了，注意是放入数组，HTMLCollection没有sort方法 ``` 13792 ```
- 2019-11-15 14:42回答 1 已采纳 循环的时候从集合里面找个变量当id或name，用id或name隐藏显示就行。
- 2023-08-25 15:50cfqq1989的博客 有哪些控件：指针：用于拖动功能块。控制点：同上。就是。【左侧：输入输出】，【右侧：只输出】Box ：在FB原有的基础上，增加运行添加。用于对结构体的成员变量赋值。用于输出的成员变量。
- 2018-09-11 15:07回答 2 已采纳 标签云？ http://www.17sucai.com/pins/tag/250.html
- 2016-12-27 10:02回答 9 已采纳 ## 失误了！代码如下： ``` ```
- 2018-07-25 08:12回答 3 已采纳 ``` ```
- 2023-10-09 23:52"JS模块连线流程结构图代码.zip" 提供的可能是一个实现模块化的示例，这有助于理解JavaScript中的模块工作原理。 1. **CommonJS 和 AMD** - **CommonJS** 是Node.js环境中广泛使用的模块规范，通过`require()`导入...
- 2019-05-20 12:08回答 8 已采纳 id请保持**唯一性**，依楼主需求，请给每个div设置class属性即可（此处我设置为**key**） ``` $('.key').onclick(function() { //to
- 2023-09-01 16:40在IT行业中，JavaScript是一种广泛使用的前端编程语言，用于构建交互式的网页应用。在这个场景中，我们讨论的是如何利用JavaScript集成zTree库来创建一个树形结构的菜单。zTree是一款基于jQuery的插件，它提供了丰富...
- 2022-06-02 02:03Clear Aurora的博客 一、设计内容：实现多功能数字钟，具备下列功能：1、数字钟：能计时，实现小时、分钟、秒的显示；2、数字跑表：精度至0.01秒 比如显示12.97秒；3、闹钟: 可以设定闹钟，用试验箱上的蜂鸣器作为闹铃；4、调时：可以对...
- 没有解决我的问题, 去提问
问题事件
系统已结题
12月8日
已采纳回答
11月30日-
赞助了问题酬金15元
11月25日
-
创建了问题
11月25日
悬赏问题
- ¥15 有偿求苍穹外卖环境配置
- ¥15 代码在keil5里变成了这样怎么办啊，文件图像也变了，
- ¥20 Ue4.26打包win64bit报错，如何解决？(语言-c++)
- ¥15 clousx6整点报时指令怎么写
- ¥30 远程帮我安装软件及库文件
- ¥15 关于#自动化#的问题：如何通过电脑控制多相机同步拍照或摄影（相机或者摄影模组数量大于60），并将所有采集的照片或视频以一定编码规则存放至规定电脑文件夹内
- ¥20 深信服vpn-2050这台设备如何配置才能成功联网？
- ¥15 Arduino的wifi连接，如何关闭低功耗模式？
- ¥15 Android studio 无法定位adb是什么问题？
- ¥15 C#连接不上服务器，