首頁 web前端 js教程 jsMind透過滑鼠拖曳的方式調整節點位置_javascript技巧

jsMind透過滑鼠拖曳的方式調整節點位置_javascript技巧

May 16, 2016 pm 04:04 PM
jsmind 滑鼠拖曳

jsMind是一個純javascript實現的心智圖類別庫,基於html5的canvas實現,以BSD協定開源。

提供了心智圖的顯示,編輯等功能,支援freemind資料格式,有豐富的開發介面可供使用,具體功能請造訪軟體首頁進一步了解。

jsMind 現已支援透過滑鼠拖曳的方式調整節點位置了。只需引用最新版本的 jsmind.js 以及 jsmind.draggable.js 即可使用該功能。要注意的是,當心智圖設定為不可編輯的時候,拖曳功能也將同時禁止。

請造訪 專案首頁:http://hizzgdev.github.io/jsmind/ 體驗效果。

複製程式碼 程式碼如下:




以上所述就是本文的全部內容了,希望大家能夠喜歡。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1664
14
CakePHP 教程
1423
52
Laravel 教程
1317
25
PHP教程
1268
29
C# 教程
1242
24
如何在Vue專案中利用jsmind實現心智圖的自動儲存與復原功能? 如何在Vue專案中利用jsmind實現心智圖的自動儲存與復原功能? Aug 15, 2023 pm 06:25 PM

如何在Vue專案中利用jsmind實現心智圖的自動儲存與復原功能?心智圖是一種很有用的工具,可以幫助我們整理和展示思考結構。在Vue專案中,我們可以利用jsmind函式庫來實現可互動的心智圖功能。在這篇文章中,我們將講解如何利用jsmind函式庫,在Vue專案中實現心智圖的自動儲存和復原功能。首先,我們需要在Vue專案中引入jsmind函式庫。我們可以通過npm

如何使用Vue和jsmind製作強大的心智圖應用? 如何使用Vue和jsmind製作強大的心智圖應用? Aug 15, 2023 pm 08:49 PM

如何使用Vue和jsmind製作強大的心智圖應用?引言:心智圖是一種非常有用的工具,它可以幫助我們整理和組織思維,使得複雜的問題變得清晰明了。在現代化的網路應用中,Vue和jsmind是兩個非常流行的工具,它們可以幫助我們快速建立一個強大的心智圖應用程式。本文將介紹如何使用Vue和jsmind製作一個功能豐富的心智圖應用,並提供相關的程式碼範例。步驟一:

使用Vue和jsmind如何實現心智圖的節點標註和註解功能? 使用Vue和jsmind如何實現心智圖的節點標註和註解功能? Aug 16, 2023 pm 04:01 PM

使用Vue和jsmind如何實現心智圖的節點標註和註解功能?引言:心智圖是一種用來表達和組織思維的工具,它透過樹狀結構將不同主題和子主題之間的關係進行視覺化,使得思路清晰、易於理解。在實際應用中,我們經常需要在心智圖的節點上進行標註和註釋,以便更好地記錄和分析思考過程。本文將介紹如何使用Vue和jsmind建立一個簡單的心智圖,並實現節點標註和註解的

使用Vue和jsmind如何實現心智圖的節點樣式自訂和皮膚切換? 使用Vue和jsmind如何實現心智圖的節點樣式自訂和皮膚切換? Aug 27, 2023 pm 12:40 PM

使用Vue和jsmind如何實現心智圖的節點樣式自訂和皮膚切換?心智圖是一種常用的思考工具,它可以幫助我們整理想法、記錄思考過程和展示關聯關係。 Vue.js是一個流行的前端框架,jsmind是一個基於Vue的思維導圖插件,它提供了豐富的API,可以方便地自訂節點樣式和實現皮膚切換。首先,我們需要安裝並引入jsmind和Vue.js。你可以在jsmin

使用Vue和jsmind如何實現心智圖的分支和分割操作? 使用Vue和jsmind如何實現心智圖的分支和分割操作? Aug 16, 2023 pm 06:09 PM

使用Vue和jsmind如何實現心智圖的分支和分割操作?心智圖是一種常用的思考和組織思維的工具,它可以幫助我們清楚地展示和理解問題、想法和思考之間的關係。在前端開發中,我們可以使用Vue和jsmind函式庫來實現心智圖的分支和分割操作。首先,我們需要在Vue專案中引入jsmind函式庫。可以透過npm安裝jsmind,或直接下載jsmind.js檔案並引入到

使用Vue和jsmind如何實現心智圖的全域樣式和主題切換功能? 使用Vue和jsmind如何實現心智圖的全域樣式和主題切換功能? Aug 13, 2023 pm 06:37 PM

使用Vue和jsmind如何實現心智圖的全域樣式和主題切換功能?引言:心智圖是一種常用的思考工具,能夠幫助我們進行邏輯思考和思考表達。本文將介紹如何使用Vue和jsmind函式庫來建立一個具有全域樣式和主題切換功能的心智圖。一、準備工作在開始寫程式碼之前,我們需要準備一些必要的工作。建立Vue專案首先,我們需要建立一個Vue專案。可以使用VueCLI快速

如何在Vue專案中利用jsmind實現心智圖的列印和匯出為圖片的功能? 如何在Vue專案中利用jsmind實現心智圖的列印和匯出為圖片的功能? Aug 15, 2023 pm 02:07 PM

如何在Vue專案中利用jsmind實現心智圖的列印和匯出為圖片的功能?簡介:近年來,隨著大數據和資訊量的快速增長,人們需要更有效地處理和組織知識。心智圖作為一種有效的知識組織工具,被廣泛應用於各行各業。在Vue專案中利用jsmind實現心智圖的列印和匯出為圖片的功能,可以幫助我們更好地整理和分享我們的思維。步驟一:安裝jsmind首先,我們需要在Vue

如何在Vue專案中快速整合jsmind心智圖插件? 如何在Vue專案中快速整合jsmind心智圖插件? Aug 26, 2023 pm 12:31 PM

如何在Vue專案中快速整合jsmind心智圖插件?引言:在現代軟體開發中,心智圖是一種常見的用於視覺化思維和資訊組織的工具。 Vue是一個流行的JavaScript框架,我們可以使用它來建立Web應用程式。在這篇文章中,我們將討論如何快速整合jsmind心智圖插件到Vue專案中。步驟1:安裝jsmind首先,我們需要在Vue專案中安裝jsmind。打開終

See all articles