Getting started (what is SVG?)

Events happening in the community are now at Drupal community events on www.drupal.org.
sime's picture

SVG is an acronym that some people might have glossed over. So I want to start with the basics to make sure that the reader knows what this is all about. SVG is not very complex when you pull it a part. It is a markup language for graphics. It is:

S = Scalable - you can display the image at any size without resolution loss.
V = Vector. Lines and shapes are defined by geometry, not dots.
G = Graphics, yeah?

Example

So, what does it look like? An example from w3org. Note:If you are using IE7 you will be asked if you want to activate their SVG plugin.)

If you go to the page source, you will see:

<?php
<?xml version="1.0" standalone="no"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="12cm" height="4cm" viewBox="0 0 1200 400"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
  <desc>Example rect01 - rectangle with sharp corners</desc>

  <!-- Show outline of canvas using 'rect' element -->
  <rect x="1" y="1" width="1198" height="398"
        fill="none" stroke="blue" stroke-width="2"/>

  <rect x="400" y="100" width="400" height="200"
        fill="yellow" stroke="navy" stroke-width="10"  />
</svg>
?>

Nothing complex.

So what now?

Now it's easy to write some php or jquery to generate this, and extending the code would allow data to be passed in. But the ultimate outcome would be re-usable code for generating the SVG, and some other code for converting raw data into graphical displays (charts, maps, UML, etc).

I don't speculate about the best solution. For example, it would be useful to have these libraries in php, but if you need dynamic graphing you might want data via AJAX with JavaScript parsing it into SVG sounds.

Related Drupal Modules

xStatistics: http://drupal.org/project/xstatistics
Graphstat: http://drupal.org/node/33946

Links

Bèr's Xstatistics queue has a ticket with some discussion plus some links that Bèr has dug up from when he has looked at this in the past:
http://blog.codedread.com/archives/2005/06/21/detecting-svg-viewer-capab...
http://www.phpclasses.org/browse/package/2184.html
http://cristian.nexcess.net/ajax/svg_chart/

Also, I have found this svg.org wiki quite useful (for example the vector format comparisons):
http://wiki.svg.org/Main_Page

Thanks
Simon

Comments

adobe phasing out svg

Looks like they are phasing

sime's picture

Looks like they are phasing out because of growing native browser support, which is a great thing. :-)

Or...

ghoti's picture

Or, they're phasing it out because they've purchased Macromedia, and see SVG as a potential competitor to Flash.

Which could be not so great a thing.

What about Sparkle?

Paul Chvostek — Developer, integrator, Internet plumber.

Yes, this sort of thing

sime's picture

Yes, this sort of thing happens in business. If they replace SVG import/export in Illustrator, then I might come to the same conclusion.

To quote http://www.adobe.com/svg/

Adobe has taken a leadership role in the development of the SVG specification and continues to ensure that its authoring tools are SVG compatible.

phasing out by 2008

snufkin's picture

http://www.adobe.com/svg/eol.html

Adobe has decided to discontinue support for Adobe SVG Viewer. There are a number of other third-party SVG viewer implementations in the marketplace, including native support for SVG in many Web browsers. The SVG language and its adoption in the marketplace have both matured to the point where it is no longer necessary for Adobe to provide an SVG viewer.

Displaying SVG

johnflower's picture

I've been playing with displaying SVG in Drupal. I have a 'working' 6.x module at http://johnflower.org/blog/drupal-needs-svg. It is usable, but needs polishing.

Location and Mapping

Group organizers

Group categories

Wiki type

Group notifications

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds: