Бесплатный инструмент для создания древовидной онлайн-диаграммы со ссылками на каждый элемент.

Я черпаю вдохновение из схемы дерева обучения от Khan Academy . Я хотел бы создать подобное дерево для другой темы. Каждый элемент должен быть кликабельной ссылкой.

Дополнительные критерии:

  • Это должно быть размещенное веб-приложение.
  • Ссылки должны быть любыми гиперссылками.
  • Мне не нужно экспортировать созданную диаграмму.

Есть ли бесплатный инструмент, который позволяет мне создать интерактивную древовидную диаграмму онлайн?

Пример древовидной диаграммы

Ответы (2)

Вы можете попробовать draw.io , он поддерживает кликабельные ссылки.

Я работаю над проектом.

Есть ли у Draw.io шаблон для древовидной диаграммы?

У вас есть несколько вариантов:

  1. Вы можете использовать Graphviz , где вы вручную создадите список узлов со ссылками, и Graphviz разметит вашу диаграмму для вас и сгенерирует формат SVG. В дополнение к автономному инструменту существует онлайн-версия инструмента graphviz, но обратите внимание, что он не содержит изображения, которое вам все равно потребуется для отправки полученного SVG-файла на сервер и встраивания его в веб-страницу . - Это потребует от вас некоторого знакомства с языком компоновки графов DOT .
  2. В автономном режиме вы можете вручную нарисовать дерево с помощью Inkscape , добавить URL-адреса для перехода и сохранить их в формате SVG со ссылками. Полученный SVG можно встроить в HTML-страницу и загрузить на ваш веб-сервер. Хотя это не онлайн-инструмент, он позволяет вам рисовать, а не кодировать график.
  3. В Интернете существует ряд бесплатных онлайн-редакторов SVG, которые позволят вам нарисовать древовидную диаграмму, некоторые из которых позволяют включать ссылки для элементов — я знаком с DrawSVG, который определенно позволяет добавлять гиперссылки к элементам один раз . нарисовано.

Все вышеперечисленное можно использовать бесплатно. Автономные инструменты являются бесплатными, с открытым исходным кодом и кросс-платформенными.

ОП сказал: «Создать такую ​​интерактивную древовидную диаграмму онлайн?» что означает «онлайн». Inkscape и Graphviz — замечательные «офлайновые» инструменты, но не онлайновые.
@bgoodr - В то время, когда я ответил, Дополнительные критерии отсутствовали, поэтому не требовалось, чтобы инструмент был в сети.
@steve_barnes, понятно!
Бесплатный инструмент для создания древовидной онлайн-диаграммы со ссылками на каждый элемент.
СпросиСетьПолитика конфиденциальности1y, 1v