I am developing a web-based restaurant management system for several different venues and need to implement dynamic floor plans for table management. The tables need to be clickable and editable, the different floor plans need to be stored, not sure whether to store them in the database or as images?

I am currently stuck after looking at several options:

  • Canvas-suboptimal
  • Svg- manipulating svg file with JS seems most suitable, not sure which library to use.
  • Jquery UI - using Bootstrap and the two don't play nice together

What would you recommend for my specific case? Which JS library to use with Svg?

  • 1
    I don't think you need a separate library for manipulating SVG with JavaScript. SVG is a subset of XML, so shouldn't the usual DOM manipulation tools suffice? – Kodiologist Jun 12 '17 at 22:31
  • Well, I saw several other questions discussing using something like D3.js or Raphaël.js. I do not have experience with Svg manipulation, so would appreciate any advice about best practices. – bashmaistora Jun 13 '17 at 9:53

Essential Diagram for JavaScript supports manipulating SVG based nodes and serialization.


Diagram JS with SVG nodes

The whole product is available for free through the community license if you qualify (less than 1 million USD in revenue).

Note: I work for Syncfusion.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.