Библиотека JS для создания интерфейса mindmap like
Мне нужно создать интерфейс, подобный тому, что http://www.madeiracloud.com обеспечивает рисование сетевой архитектуры (для разных целей, чем то, что они делают).
В основном пользователи должны иметь возможность перетаскивать элементы на холст и связывать их с помощью стрелок направления.
Какую библиотеку я должен использовать для этого? Я смотрю на d3, raphael и ocanvas.
Ответы
Ответ 1
Raphaël (http://raphaeljs.com/) в сочетании с Библиотекой графов Дракулы (http://dracula.ameisenbar.de/), вы начнете.
а также идеально подходит:
Многоканальные Дерева
JavaScript InfoVis Toolkit предоставляет инструменты для создания интерактивных визуализаций данных для Интернета.
http://thejit.org/
Edit:
вы также можете взглянуть на Processing.js
http://processingjs.org/
Processing.js - это сестра проекта популярного языка визуального программирования Processing, предназначенного для Интернета. Processing.js делает ваши визуализации данных, цифровое искусство, интерактивную анимацию, образовательные графики, видеоигры и т.д. Работать с использованием веб-стандартов и без каких-либо подключаемых модулей. Вы пишете код с использованием языка обработки, включите его на свою веб-страницу, а обработчик .js сделает все остальное.
Ответ 2
Вы должны посмотреть проект MindMap, который использует Raphael.js внутри.
Вы можете найти демо на http://kenneth.kufluk.com/google/js-mindmap/
![enter image description here]()
Ответ 3
В коммерческом контексте вы также должны посмотреть, что yFiles для HTML может предложить.
Это общий графический чертеж и редактирование библиотеки javascript, которая легко решает ваш "перетаскивание и подключение". Существует также конкретный пример карты разума, доступный онлайн:
![Mind map Снимок экрана демонстрационного приложения]()
но в этом приложении узлы не создаются с помощью перетаскивания. Это, конечно, также возможно, как можно увидеть в этой онлайн-демонстрации.
Конкретными сильными сторонами этой библиотеки являются автоматическая компоновка узлов и соединений, поэтому, если вы создаете большие сети или автоматически заполняете график из внешнего источника данных, это очень удобно. Однако, если вам не нужен этот набор функций, конечно, могут работать и более простые решения. Обратите внимание, что d3 фокусируется на просмотре данных и не столько на взаимодействие пользователя и создание графиков в интерактивном режиме.
Отказ от ответственности: я работаю в компании, которая создает эту библиотеку, однако я не представляю своего работодателя на SO. Мои комментарии - мои собственные.