SVG Rose - Fun with vector graphics.
I love vector graphics. There is something beautiful about taking a huge chuck of seemingly random image data(raster) and turning it into a orchestrated set of mathematical functions. Why would a person want to do such a thing? Well if you have ever used an imaging app on your computer to look at photos then you've noticed that when you zoom in repeatedly you start to pixelate the picture(degrade the quality to the point where you see large boxes). If your computer screen is too small to display the image or the image is too big for the display you actually lose picture quality. With vector graphics you can zoom in as much as you want without the pixelation! Perfect for TVs, Cellphones, computers, or any display device.
SVG is an open standard XML standard that defines 2D graphics, scripting, animations, etc. much like the flash or macromedia content we familiar with as we browse the web today. SVG is a standard developed by the W3C (SVG).
Vector graphic systems are really neato.
Raster (Binary Data) | Vector (Textual Data) |
![]() |
If your browser doesn't support vector graphics, you may need to install this Adobe plugin.
SVG Viewer
Later I'll write some papers on the use of scripting to actually create dynamic SVG documents for interfaces.
Links of interest:
Adobe SVG Developer TutSVG Primer
GPS SVG System
SVG Chess & SVG Chess Validation
Anatomy of Dynamic SVG Web Services
KinLinDev Inkscape. Draw Freely.
Peter Selinger: Potrace - Transforming bitmaps into vector graphics
Graphics-Potrace-0.73 - bindings to the potrace library - metacpan.org - Perl programming language - Graphics::Potrace::Vectorial->create_exporter,trace()
A List Apart: Articles: Using SVG for Flexible, Scalable, and Fun Backgrounds, Part II
canvg - Javascript SVG parser and renderer on Canvas - Google Project Hosting - It takes a URL to a SVG file or the text of an SVG file, parses it in JavaScript, and renders the result on a Canvas element. The rendering speed of the examples is about as fast as native SVG.
PDF in HTML
PDF.js A general-purpose, web standards-based platform for parsing and rendering PDFs.pdfkit/pdfkit - Create PDFs using plain old HTML+CSS. Uses wkhtmltopdf/wkhtmltopdf (QtWebKit) on the back-end which renders HTML using Webkit.
< Prev Next >