Lengthy is a JavaScript microlibrary (1.2kb min, 0.7kb gzipped) to get the length of SVG shapes. The length will automatically be added to the element as a CSS Var to make it easy to do CSS animations of SVG stroke-dashoffset
for the wonderful line drawing SVG technique and other interesting animations.
Best jQuery SVG Tutorial Plugins & Tutorials with Demo
Lengthy : MicroLibrary for SVG Shape Length in a CSS Var
JointJS – JavaScript Diagramming Library
JointJS is a JavaScript diagramming library. It can be used to create either static diagrams or, and more importantly, fully interactive diagramming tools and application builders.Rappid is a diagramming framework for advanced applications, delivering the best of HTML 5 + SVG and providing you with the right tools to build outstanding products.
Features:
- basic diagram elements (rect, circle, ellipse, text, image, path)
- ready-to-use diagram elements of well-known diagrams (ERD, Org chart, FSA, UML, PN, DEVS, …)
- custom diagram elements based on SVG or programmatically rendered
- interactive elements and links
- connecting diagram elements with links
- customizable links, their arrowheads and labels
- links smoothing (bezier interpolation)
- magnets (link connection points) can be placed basically anywhere
- hierarchical diagrams
- serialization/deserialization to/from JSON format
- highly event driven – you can react on any event that happens inside the paper
- zoom in/out
- touch support
Integrated-2D : Javascript 2D rendering framework for SVG & Canvas
Integrated-2D – is an Open source Javascript framework for rendering 2D graphics on SVG, Canvas and WebGL contexts. I2D’s simple syntax and semantics lets you combine the power of Vector graphics and Bitmap to achieve complex visualisations easily.
I2Djs provides single Application Programming Interface to create and animate elements across different graphic rendering contexts by leveraging their underlying capabilities. Developers can make use of I2D’s multi-layered contextual approach with capabilities from more than one context seamlessly for creating powerful composite visualisation under a single roof.
I2D also provides a unique data-driven approach with join-actions for DOM manipulation based on data binding.
SVG 3D Builder : JavaScript Library to create 3D Models
SVG 3D Builder framework aims at creating 3d models with SVG and to provide a concise API. It is purely developed with concepts of two-dimensions. One of its essential implementations is Bezier in both curve and surface. It is one thing to describe them with mathematic equations, but another thing to illustrate them with computer graphics.
AlphaTab : Music notation & Guitar Tablature rendering Library
AlphaTab is a cross platform music notation and guitar tablature rendering library.
You can use alphaTab within your own website or application to load and display music sheets from data sources like Guitar Pro or the built in markup language named alphaTex.
Features:
- load GuitarPro 3-5, GuitarPro 6, AlphaTex or MusicXML (experimental)
- render as SVG, HTML5 canvas, GDI+,…
- adapt to your responsive design by dynamic resizing
- play the music sheet via HTML5 Web Audio API and Flash