Suggestions: Canvas or SVG

Question

In my web application I have to draw schematic network components such as routers, switches and son on. My question is now as follows. Which technology should I use HTML5 canvas or SVG? I already read this article about that. However I am still unsteady.

I think SVG would better cover with my requirements because the user must be able to resize the element. Also it must be possible to animate the images.

Thanks for your suggestions.

Answer 1

I personally would recommend SVG because of following reasons:

• you probably won't have to display huge numbers of objects --> performance is not an issue.
• animation, transformations and user interaction are easier to implement in SVG compared to canvas

There are some additional ressources yous should read:

• Thoughts on when to use Canvas and SVG (also describes a hybrid approach)
• Simon Sarris excellent reply in this stackoverflow thread (I also posted some benchmarks between SVG and canvas in the same thread)

Note: You might also consider browser compatibility if that's an issue for you.