SVG
Friday, August 8th, 2008
Category: SVG
Dmitry Baranovskiy of Atlassian has created Raphaël "a small JavaScript library that should simplify your work with vector graphics on the web. In case you want to create your own specific chart or image crop-n-rotate widget, you can simply achieve it with this library." Raphaël uses SVG and VML as a base for graphics creation. Read the rest...
Friday, July 25th, 2008
Category: SVG
Kevin Lindsey has a suite of tests that show various intersection routines for SVG objects: Each link allows you to manipulate the shapes listed. All intersections between the two shapes are updated as you manipulate the shapes. Some intersections display additional information when the shapes do not intersect. As an example, the circle-circle intersection determines Read the rest...
Tuesday, July 15th, 2008
Category: Canvas
, SVG
Robert O'Callahan and Dave Hyatt have been chatting about paint servers as Robert creates SVG ones and then arbitary elements. This continues the meme of taking common use cases and making them easy via CSS (e.g. reflections). Here is the SVG version: PLAIN TEXT HTML: <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg"> <head> <style> h1 { Read the rest...
Wednesday, June 4th, 2008
Category: Firefox
, HTML
, SVG
It seems so obvious once you think about it, but Rob O'Callahan from Mozilla took us by surprise in his blog post demonstrating his experimental branch of Gecko that allows you to apply SVG effects to HTML. The code for applying the effects above follows: PLAIN TEXT XML: <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg"> Read the rest...
Tuesday, April 1st, 2008
Category: CSS
, Examples
, SVG
Torrey Rice took Safari 3.1 and the new CSS Animations feature, and mashed it up with SVG to create a fisheye demo. All the functionality through CSS: PLAIN TEXT CSS: .dock img { width:50px; padding:10px; float:left; position:relative; display:block; -webkit-transition:width 0.5s ease-out, top 0.2s ease-out; } .dock img:hover Read the rest...
-32258064516130000 rating from 31 votes
Wednesday, March 12th, 2008
Category: Showcase
, SVG
WiseMapping is the latest Ajax mind mapping tool developed by Paulo Veiga and three friends. Wise Mapping is a free web mind mapping tool that leverages the power of Mind Maps mixing new technologies like vectorial languages (SVG and VML) and the power of the whole Web 2.0 concept. The tools uses SVG and VML Read the rest...
Friday, January 18th, 2008
Category: SVG
, Utility
Amaltas Bohra has created a drawing/editing tool that allows you to create simple shapes and pictures. The application uses SVG to do its work, and Prototype to handle the Ajaxyness.
Monday, November 5th, 2007
Category: SVG
, UI
Raymond Penners has launched sosymbol, a site with a collection of web2.0 (read: big?) style buttons and symbols that can be mashed up online and exported to svg/screensaver.
Friday, October 5th, 2007
Category: Google
, SVG
It's Friday game day! Raphael has created an SVG based Checkers game using his Isometric Game Engine: The Isometric Game Engine is a project to make cool games you can run in your browser. Checkers is the first game made with the engine, involving essential game elements such as creating a board, moving pieces around Read the rest...
Thursday, September 13th, 2007
Category: Microsoft
, SVG
Sam Ruby has done it again, this time taking Toine de Greef's work and making it better. Now your SVG can work on IE via Silverlight: Cool. SVG to Silverlight via XSLT. But, embedding in HTML using comments? I think I can improve upon that. Demo: Toucan. Rendered using native SVG on recent Gecko, Opera, Read the rest...
Wednesday, August 22nd, 2007
Category: SVG
Chris Double has posted a SVG video tag demo that plays a port of a Silverlight demo. As you watch videos playing, you can move, resize, and rotate the canvases. All via: PLAIN TEXT HTML: <video id="svg_v1" src="http://www.bluishcoder.co.nz/video_svg_demo.ogg"></video>
Wednesday, August 1st, 2007
Category: Component
, Flash
, SVG
Ever wanted to let your users draw in a form field? <InputDraw/> lets you do just that, saving the results as SVG for you to include in a form field. It's based on Flash and is easy to use: PLAIN TEXT HTML: <script src="swfobject.js" type="text/javascript"></script> <script src="inputdraw.js" type="text/javascript"></script> <div id="place"></div> <input type="hidden" id="svgdraw" Read the rest...