Выбор технологии реализации

[sdan]

Можно сказать, что никогда не программировал под web, решил попробовать. Для примера решил выбрать конкретную задачу. Хотелось бы сделать дерево объектов, листы и узлы которых можно было бы переставлять местами путем drag and drop в рамках одного уровня. Структура дерева формируется на сервере. Визуально это хотелось бы что бы выглядело так

 

Как я понимаю есть несколько вариантов реализации визуального представления

1. Путем выполнения JS скрипта в который должны быть переданы первоначальные параметры необходимые для отрисовки в Canvas данного изображения. Предполагаю, что не получиться отобразить соеденительные линии. Но подозреваю, что могут быть проблемы с реализацией d&d

2. Путем серверного формирования Div и css для отображения такой структуры. Мне кажется, что данный пусть почти не возможен, только если не развернуть требуемое дерево на 90 градусов, чтобы блоки были выровнены по горизонтали. При выборе такой технологии d&d вроде бы реализуема

3. Путем серверного формирования картинок и css

 

Могли бы направить по правильному пути и сказать плюсы и минусы, которые вы видите.

 

[Great Rash]

Если речь именно про технологию, то лучше SVG с этим ничто не справится. Если же речь про конкретную реализацию, то вот, ну или погуглить "JS node graph"

[sdan]

Если речь именно про технологию, то лучше SVG с этим ничто не справится. Если же речь про конкретную реализацию, то вот, ну или погуглить "JS node graph"

Спасибо за ссылку, видимо, то что надо