Monday, March 3, 2014

Top SVG Javascript Libraries Worth Looking At

Top SVG Javascript Libraries Worth Looking At

Original post by Farinspace@

SVG Javascript Libraries
Learn about SVG and simplify your work with Canvas/VML with these top Javascript SVG libraries you can use in your projects.
I read a great article this morning about SVG (Scalable Vector Graphics), its current state on the web and how to use it. If you’re even a slight bit curious about SVG, it’s really a great read.
So I got to wondering how many Javascript SVG libraries/frameworks are out there… Well nothing that a good google search and some looking around couldn’t cure.
Here is what I found… if you know of any JS SVG API I have not mentioned please, please let me know.

SVG Javascript Libraries

  1. Raphaël—JavaScript Library
    Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. Raphaël uses the SVG W3C Recommendation and VML as a base for creating graphics. It’s goal is to provide an adapter that will make drawing vector art compatible cross-browser and easy.
  2. svgweb
    SVG Web is a JavaScript library which provides SVG support on many browsers, including Internet Explorer, Firefox, and Safari. Using the library plus native SVG support you can instantly target ~95% of the existing installed web base.
  3. Processing.js
    Processing.js is an open programming language for people who want to program images, animation, and interactions for the web without using Flash or Java applets. Processing.js uses Javascript to draw shapes and manipulate images on the HTML5 Canvas element. Processing.js is explicitly developed for browsers that support the HTML5 <Canvas> element. Processing.js runs in FireFox, Safari, Opera and Chrome but will not be supported in Internet Explorer until Mircosoft catches up.
  4. dojox.gfx
    dojox.gfx (GFX) is a cross-platform vector graphics API. It loosely follows SVG as the underlying model. GFX helps to isolate your application from the many native vector graphics implementation differences across all modern Browsers.
  5. ExplorerCanvas
    Modern browsers like Firefox, Safari, Chrome and Opera support the HTML5 canvas tag to allow 2D command-based drawing. ExplorerCanvas brings the same functionality to Internet Explorer. To use, web developers only need to include a single script tag in their existing web pages.
  6. SVGKit
    SVGKit is a collection of JavaScript libraries for painless client-side SVG manipulation: SVGKit provides browser-independent access, SVGCanvas implements Canvas API, and SVGPlot plots/graphs data and functions.
  7. PlotKit
    PlotKit is a Chart and Graph Plotting Library for Javascript. It has support for HTML Canvas and also SVG via Adobe SVG Viewer and native browser support.
  8. JSDrawing
    JSDrawing is a client-side JavaScript library that allows you to render vector graphics independently of browser and platform. The rendering API is based on SVG’s path commands and adding support for new renderers is very simple.
  9. VectorGraphics
    This JavaScript VectorGraphics library provides graphics capabilities for JavaScript: functions to draw circles, ellipses (ovals), oblique lines, polylines and polygons (for instance triangles, rectangles) dynamically into a webpage. Usage of this Vector Graphics library should be easy even if you don’t have JavaScript experience.
  10. jQuery SVG
    A jQuery plugin that lets you interact with an SVG canvas.
    PERGOLA is a JavaScript framework and library using SVG, designed to provide developers with a powerful tool for building web applications, User Interfaces, presentations and more (the framework requires a license)

Learning More About SVG