vue就是邊做這個項目邊學的 代碼可能有點亂 還望各位大神勿噴
如果代碼對您有幫助 麻煩辛苦幫我點個star
預覽位址
https://svg.yaolunmao.top
如何使用
# 克隆項目
git clone https://github.com/yaolunmao/vue-webtopo-svgeditor.git
# 進入項目目錄
cd vue-webtopo-svgeditor
# 安裝依賴
yarn install
# 啟動服務
yarn serve
操作
點選載入模闆 進入預覽頁點選模拟硬體 等待兩秒鐘即可看到動态效果
- 滑鼠左鍵選中元件 按住可拖動至畫布
- 滑鼠輕按兩下畫布取消選中元件
- 右側工具欄調整選中元件樣式
- 鍵盤↑↓←→可移動選中元件
- ctrl+c複制目前選中元件
- deleted删除目前選中元件
- 滑鼠滾輪放大縮小選中元件
Todo
- 滑鼠框選批量選中
- 畫布綁定mqtt平台
- 元件旋轉
- 畫布縮放
- 編輯器撤銷、重做
截圖
畫圖頁:

預覽頁:
License
MIT