Nov 10

tape

This interesting concept has caught my attention: SVG (Scalable Vector Graphics) Spinning

Using svgweb, which allows using Firefox’s (and other browsers’) native SVG support while also providing a fallback to flash for Internet Explorer, super-cool.

Some JavaScript dives into the SVG and wraps each path element in a “spinner” callback (that repeatedly sets the elements “transform” attribute).

Check out 2 examples which make up for some interesting floating visuals.

Example 1: Cat
Example 2: Tape

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.

Once dropped in you get partial support for SVG 1.1, SVG Animation (SMIL), Fonts, Video and Audio, DOM and style scripting through JavaScript, and more in about a 60K library. Your SVG content can be embedded directly into normal HTML 5 or through the OBJECT tag. If native SVG support is already present in the browser then that is used, though you can override this and have the SVG Web toolkit handle things instead. No downloads or plugins are necessary other than Flash which is used for the actual rendering, so it’s very easy to use and incorporate into an existing web site.

See a Tech Talk at Google recently on SVG Web and Open Web Advocacy from Brad Neuberg, a member of the Open Web Advocacy team at Google:

3 Responses to “Scalable Vector Graphics towards Visuals”

  1. Brad Neuberg Says:

    Hey there, make sure you grab the latest SVG Web version. I see a number of glitches in the samples you have that I believe should be fixed now. I’m going to cut another release in a few days that will have more bug fixes as well.

    Best,
    Brad

  2. Brad Neuberg Says:

    BTW, if you use suspendRedraw as well when changing your rotation the performance will be faster on IE as well. Details: http://codinginparadise.org/projects/svgweb/docs/QuickStart.html#tip_suspendRedraw

  3. vdmoKstati Says:

    Thank you Brad, will check those out! :)

Leave a Reply