Динамические планы этажей в веб-приложении

Я разрабатываю веб-систему управления рестораном для нескольких разных заведений, и мне нужно реализовать динамические планы этажей для управления столиками. Таблицы должны быть интерактивными и редактируемыми, различные планы этажей должны быть сохранены, не знаете, хранить ли их в базе данных или в виде изображений?

В настоящее время я застрял после просмотра нескольких вариантов:

  • Холст-субоптимальный
  • Svg-манипулирование файлом svg с помощью JS кажется наиболее подходящим, но не знаю, какую библиотеку использовать.
  • Пользовательский интерфейс Jquery - использование Bootstrap, и они не очень хорошо сочетаются друг с другом

Что посоветуете для моего конкретного случая? Какую библиотеку JS использовать с Svg?

Я не думаю, что вам нужна отдельная библиотека для управления SVG с помощью JavaScript. SVG — это подмножество XML, поэтому разве обычных инструментов для работы с DOM недостаточно?
Ну, я видел несколько других вопросов, обсуждающих использование чего-то вроде D3.js или Raphaël.js. У меня нет опыта работы с Svg, поэтому буду признателен за любые советы по поводу передового опыта.

Ответы (1)

Essential Diagram для JavaScript поддерживает управление узлами на основе SVG и сериализацией.

Пример

Диаграмма JS с узлами SVG

Весь продукт доступен бесплатно по лицензии сообщества, если вы соответствуете требованиям (доход менее 1 миллиона долларов США).

Примечание: я работаю в Syncfusion.

Я не могу найти полную версию этого примера. Пожалуйста, предоставьте его, если можете.
@ІгорЖовтанюк Вы посещали jsplayground.syncfusion.com/uj0uyfqc - полный исходный код семпла можно взять оттуда - саму библиотеку нужно скачать с syncfusion.com/products/javascript/ejdiagram