作者pptipad (ipad)
看板Web_Design
標題[請益] 可以拉線拖曳的效果怎麼做呢？
時間Fri Mar 22 10:36:14 2019
目前想做出幾個物件可以透過拉線，連接想接的物件！（像流程圖那樣）
物件也能拖拉，但線不能斷要跟這移動！
在網上找過用flow chart跟jsPlumb但公司希望我不要用那些套件，因此實作上完全不知
如何著手，想請問如附圖這效果如何完成心願呢？
https://i.imgur.com/JrkqRpk.jpg
謝謝各位大俠的圍觀與幫助！感恩
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 39.8.76.13
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Web_Design/M.1553222176.A.0F3.html
※ 編輯: pptipad (39.8.76.13), 03/22/2019 10:37:07
1F：推 shter: mousedown 時 document.createElement('svg') 03/22 11:00
2F：→ shter: mousemove 時畫 Line, mouseup 時對接完成存物件到陣列 03/22 11:01
3F：→ shter: 拖動物件時把關聯的 svg 重繪起點跟終點座標 03/22 11:02
4F：→ shter: 所以重點是你自己要寫一段 code 把線跟物件的關聯記起來 03/22 11:03
5F：→ shter: 這樣改動物件時你可以從陣列中讀出相關的線一起改變 03/22 11:03
6F：→ shter: 你工作真好，我不愛套件但老闆很愛規定要找套件不能自寫.. 03/22 11:04
7F：推 HenryLiKing: 真假 我以為公司都愛自行開發欸~(? by大學生幻想 03/22 14:55
8F：推 ymcheung: 公司階段不同有差 03/23 13:36
9F：→ JPMini: 用 d3.js 做過 03/30 21:19