/ 
SVG-0.31
River stage two • 29 direct dependents • 46 total dependents
/ SVG

NAME

SVG - perl extention for generating SVG (scalable-vector-graphics)

METHODS

attrib animate cdata circle defs desc ellipse fe get_path group image line mouseaction new path polygon rectangle script style SVG text title use xmlify

SYNOPSIS #!/usr/bin/perl -w

  use SVG;
  use strict; 

  #SVG part of the script
  my $svg= SVG->new(width=>200,height=>200); 

  # use a specific constructor method to generate a group tag
  my $y=$svg->group( id     =>  'group_y',
     style  =>  {stroke=>'red', fill=>'green'} );

  $y->circle(cx=>100,cy=>100,
     r=>50,id=>'circle_y',);

  # or use a generic method to generate the tag by name

  my $z=$svg->tag('g',  id=>'group_z', 
     style=>{ stroke=>'rgb(100,200,50)', 
     fill=>'rgb(10,100,150)'} );

  $z->tag('circle',cx=>50, cy=>50,
     r=>100, id=>'circle_in_group_z',);
  
  # an anchor with a rectangle within group within group z

  my $k = $z -> anchor(id=>'anchor_k'
		     -href   => 'http://test.hackmare.com/',
		     -target => 'new_window_0') -> 
                      rectangle ( x=>20, y=>50,
                                  width=>20, height=>30,
                                  rx=>10, ry=>5,
                                  id=>'rect_k_in_anchor_k_in_group_z',);
  
  
  
  print $svg->xmlify; #implicitly use namespace svg
  
  # or....
  # explicitly use namespace svg and generate a document with its own DTD

  print $svg->xmlify(-namespace=>'svg'); 

  # or....
  #explicitly use namespace svg and generate an in-line docunent
  
  print $svg->xmlify(-namespace=>'svg',
         -inline=>1,
         xmlns=>'http://roasp.com');

DESCRIPTION

SVG is a 100% perl module which generates a nested data structure which contains the DOM representation of an SVG image. Using SV, You can generate SVG objects, embed other SVG instances within it, access the DOM object, create and access javascript, and generate SMIL animation content.

General Steps to generating an SVG document

The SVG generation process is a three step process.

First step is to construct a new SVG object.

Second step is to call constructor methods as needed (such as the circle() or path() metohds.

Third step is to generate the XML text using the xmlify command.

The xmlify command takes optional arguments to instruct the SVG object to generate the XML for the main expected required possibilities:

-stand-alone document requiring its own DTD with or without namespace declarations on thet tags, such as <svg:use />.

-in-line SVG to be embedded within other XML content, without a DTD, but with a namespace definition and

Until the third step is reached, no XML content is generated and all data generated so far is stored in a DOM-like data structure.

EXPORT

None

AUTHOR

Ronan Oger, ronan@roasp.com

SEE ALSO

perl(1) SVG::Utils http://roasp.com/

Methods

SVG uses explicit tag generation methods and generic constructors. Explicit generators are named using the name of the tag, or a similar name. When using explicit generator methods, the attributes for the tag are passed by name, and data for the method such as type of a specific tag (see fe tag) are passed preceeded with a dash.

SVG

$svg = SVG->new %properties

Creates a new svg object.

$xmlstring = $svg->xmlify %attributes

Returns xml representation of svg document.

XML Declaration

B<Name>       			B<Default Value>
version         		'1.0'
encoding        		'UTF-8'
standalone      		'yes'
namespace       		'svg'  the namespace for the dtd and for the tags
xmlns (only for inline)          "http://example.org" - see <parent > tag below
ns_url(only for inline)          'the url of the xml' - see <parent > tag below
<parent xmlns="[xmlns]"
 xmlns:[namespace]="[ns_url]"> 
-inline         '0'         If '1', then this is an inline document
                            and is intended for use inside an XML document.

identifier      		'-//W3C//DTD SVG 1.0//EN';
dtd (not for inline)           'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'
$tag = $svg->tag $name, %properties

Creates element $name with %properties.

Example:

$tag = $svg->tag('g', transform=>'rotate(-45)');
$tag = $svg->anchor %properties

create a url anchor tag. requires a child drawn object or group element.

Example: # a complete anchor with a child tag $tag = $svg->anchor( -href=>'http://here.com/some/simpler/svg.svg' ); $tag->circle(cx=>10,cy=>10,r=>1);

# alternate tag definitions
$tag = $svg->anchor(
	-href   => 'http://somewhere.org/some/other/page.html',
	-target => 'new_window'
);

$tag = $svg->anchor(
	-href   => 'http://someotherwhere.net',
	-target => '_top'
);
$tag = $svg->circle %properties

draw a circle at cx,xy with radius r

Example:

	$tag = $svg->circle(	cx=>4
                      		cy=>2
                      		r=>1,);
$tag = $svg->ellipse %properties

draw an ellipse at cx,cy with radii rx,ry

Example:

	$tag = $svg->ellipse(cx=>10
                      cy=>10
                      rx=>5
                      ry=>7
                      id=>'ellipse',
                      style=>{'stroke'=>'red',
                              'fill'=>'green'
                              'stroke-width'=>'4'
                              'stroke-opacity'=>'0.5',
                              'fill-opacity'=>'0.2'});
$tag = $svg->rectangle %properties

draw a rectangle at (x,y) with width 'width' and height 'height' and side radii 'rx' and 'ry'

Example:

	$tag = $svg->rectangle(	x=>10,
                         	y=>20,
                         	width=>4,
                         	height=>5,
                         	rx=>5.2,
                         	ry=>2.4,
                         	id=>'rect_1',);
$tag = $svg->image %properties

draw an image at (x,y) with width 'width' and height 'height' linked to image resource '-href'.

Example:

	$tag = $svg->image(	x=>100,
                         	y=>100,
                         	width=>300,
                         	height=>200,
                          '-href'=>"image.png"
                         	id=>'image_1',);

	$tag = $svg->image(	x=>100,
                      y=>100,
                      width=>300,
                      height=>200,
                      '-href'=>"image.svg"
                      id=>'image_1',);

Outputs:

<image xlink:href="image.png" x="100" y="100" width="300" height="200"/>
$tag = $svg->use %properties

Retrieve the content from an entity within an SVG document and apply it at (x,y) with width 'width' and height 'height' linked to image resource '-href'.

Example:

	$tag = $svg->use(	x=>100,
                    y=>100,
                    width=>300,
                    height=>200,
                    '-href'=>"image.svg#image_1"
                    id=>'image_1',);

Outputs:

<use xlink:href="image.svg#image_1"  x="100" y="100" width="300" height="200"/>

According to the SVG specification, the 'use' element in SVG can point to a single element within an external SVG file.

SEE ALSO:

anchor.

$tag = $svg->polygon %properties

draw an n-sided polygon with vertices at points defined by string 'x1 y1,x2 y2,x3 y3,...xy yn'. use method get_path to generate the string.

Example:

# a five-sided polygon

my $xv = [0,2,4,5,1];

my $yv = [0,0,2,7,5];

$points = $a->get_path(x=>$xv,
                        y=>$yv,
                      -type=>'polygon',);

$c = $a->polygon (%$points,
                  id=>'pgon1',
                  style=>\%polygon_style);

SEE ALSO:

polyline.

path.

get_path.

$tag = $svg->polyline %properties

draw an n-point polyline with points defined by string 'x1 y1,x2 y2,...xn yn'. use method get_path to generate the vertices from two array references.

Example:

# a 10-pointsaw-tooth pattern

my $xv = [0,1,2,3,4,5,6,7,8,9];

my $yv = [0,1,0,1,0,1,0,1,0,1];

$points = $a->get_path(x=>$xv,
                        y=>$yv,
                      -type=>'polyline',
                      -closed=>'true'); #specify that the polyline is closed.

my $tag = $a->polyline (%$points,
                  id=>'pline_1',
                  style=>{'fill-opacity'=>0,
                          'stroke-color'=>'rgb(250,123,23)'}
                  );

SEE ALSO:

get_path.

$tag = $svg->line %properties

draw a straight line between two points (x1,y1),(x2,y2).

Example:

my $tag = $svg->line( id=>'l1',
                      x1=>0,
                      y1=>0,
                      x2=>10,
                      y2=>10,);

SEE ALSO:

polyline.

$text = $svg->text %properties

define the container for a text string to be drawn in the image.

Example:

my $text = $svg->text( id=>'l1',x=>10
                      y=>10,) -> cdata('hello, world');

SEE ALSO:

desc.

cdata.

$tag = $svg->title %properties

generate the description of the image.

Example:

my $tag = $svg->title( id=>'root-title')->cdata('hello this is the title');
$tag = $svg->desc %properties

generate the description of the image.

Example:

my $tag = $svg->desc( id=>'root-desc')->cdata('hello this is a description');
$tag = $svg->script %properties

Example:

my $tag = $svg->script(-type=>"text/ecmascript");

# populate the script tag with cdata
# be careful to manage the javascript line ends.
# qq|text| or qq§text§ where text is the script 
# works well for this.

$tag->cdata(qq|function d(){//simple display function
      for(cnt = 0; cnt < d.length; cnt++)
        document.write(d[cnt]);//end for loop
      document.write("<BR>");//write a line break
    }//end function|);
$tag = $svg->path %properties

Example:

# a 10-pointsaw-tooth pattern drawn with a path definition

my $xv = [0,1,2,3,4,5,6,7,8,9];

my $yv = [0,1,0,1,0,1,0,1,0,1];

$points = $a->get_path(x=>$xv,
                        y=>$yv,
                      -type=>'path',
                      -closed=>'true'); #specify that the polyline is closed.

$tag = $svg->path (%$points,
                  id=>'pline_1',
                  style=>{'fill-opacity'=>0,
                          'fill-color'=>'green',
                          'stroke-color'=>'rgb(250,123,23)'}
                  );

SEE ALSO:

get_path.

$path = $svg->get_path %properties

A method which returns the text string of points correctly formatted to be incorporated into the multi-point SVG drawing object definitions (path, polyline, polygon)

input:

output: a hash reference consisting of the following key-value pair:
points = the appropriate points-definition string
-type = path|polygon|polyline
-relative = 1 (points define relative position rather than absolute position)
-closed = 1 (close the curve - path and polygon only)

Example:

#generate an open path definition for a path.
my ($points,$p);
$points = $svg->get_path(x=>\@x,y=>\@y,-relative=>1,-type=>'path');

#add the path to the SVG document 
my $p = $svg->path( %$path,
                 style=>\%style_definition); 

#generate an closed path definition for a a polyline.
$points = $svg->get_path( x=>\@x,
                       y=>\@y,
                       -relative=>1,
                       -type=>'polyline',
                       -closed=>1); # generate a closed path definition for a polyline

# add the polyline to the SVG document
$p = $svg->polyline (%$points,
                   id=>'pline1',);
animate(\%params)

Generate an SMIL animation tag. This is allowed within any of the nonempty tags. Refer to the W3C for detailed information on the subtleties of the animate SMIL commands.

inputs: -method = Transform | Motion | Color
$tag = $svg->group %properties

define a group of objects with common properties. groups can have style, animation, filters, transformations, and mouse actions assigned to them.

Example:

$tag = $svg->group(
	id        => 'xvs000248',
	style     => {
		'font'      => [ qw( Arial Helvetica sans ) ],
		'font-size' => 10,
		'fill'      => 'red',
	},
	transform => 'rotate(-45)'
);
$tag = $svg->defs %properties

define a definition segment. A Defs requires children

Example:

$tag = $svg->defs(id  =>  'def_con_one',);
$svg->style %styledef

Sets/Adds style-definition for the following objects being created.

Style definitions apply to an object and all its children for all properties for which the value of the property is not redefined by the child.

$svg->mouseaction %styledef

Sets/Adds mouse action definitions for tag

$svg->mouseaction %styledef

Sets/Adds mouse action definitions.

$svg->attrib $name, $val
$svg->attrib $name, \@val
$svg->attrib $name, \%val

Sets attribute to val for a tag. }

$svg->cdata $text

Sets cdata to $text.

Example:

	$svg->text(style=>{'font'=>'Arial','font-size'=>20})->cdata('SVG.pm is a perl module on CPAN!');

  my $text = $svg->text(style=>{'font'=>'Arial','font-size'=>20});
  $text->cdata('SVG.pm is a perl module on CPAN!');

Result:

	E<lt>text style="font: Arial; font-size: 20" E<gt>SVG.pm is a perl module on CPAN!E<lt>/text E<gt>

  SEE ALSO:

  L<desc>.

  L<text>.

  L<script>.
$tag = $svg->filter %properties

Generate a filter. Filter elements contain fe filter sub-elements

Example:

	$filter = $svg->filter(filterUnits=>"objectBoundingBox",
                      x=>"-10%",
                      y=>"-10%",
                      width=>"150%",
                      height=>"150%",
                      filterUnits=>'objectBoundingBox',);

  $filter->fe();

SEE ALSO:

fe.

$tag = $svg->fe (-type=>'type', %properties)

Generate a filter sub-element Must be a child of a filter element.

Example:

	$fe = $svg->fe(-type      => 'DiffuseLighting'  #Required. the name of the element with 'fe' ommitted
		              id        => 'filter_1',
		              style     => {'font'      => [ qw( Arial Helvetica sans ) ],
                                'font-size' => 10,
                                'fill'      => 'red',},
              		transform => 'rotate(-45)' );

The following filter elements are currently supported:

feBlend, feColorMatrix, feComponentTransfer, feComposite, feConvolveMatrix, feDiffuseLighting, feDisplacementMap, feDistantLight, feFlood, feFuncA, feFuncB, feFuncG, feFuncR, feGaussianBlur, feImage, feMerge, feMergeNode, feMorphology, feOffset, fePointLight, feSpecularLighting, feSpotLight, feTile, feTurbulence,

SEE ALSO:

filter.

$tag = $svg->pattern %properties

Define a pattern

Example:

	my $pattern = $svg->pattern( id=>"Argyle_1",
                        width=>"50",
                        height=>"50",
                        patternUnits=>"userSpaceOnUse",
                        patternContentUnits=>"userSpaceOnUse");
$tag = $svg->set %properties

set a value for an existing element

Example:

	my $set = $svg->set( id=>"Argyle_1",
                        width=>"50",
                        height=>"50",
                        patternUnits=>"userSpaceOnUse",
                        patternContentUnits=>"userSpaceOnUse");
$tag = $svg->stop %properties

Define a stop

Example:

	my $pattern = $svg->stop( id=>"Argyle_1",
                        width=>"50",
                        height=>"50",
                        patternUnits=>"userSpaceOnUse",
                        patternContentUnits=>"userSpaceOnUse");
$tag = $svg->stop %properties

Define a stop

Example:

	my $gradient = $svg->gradient( -type=>'linear',
                        id=>"gradient_1",);

h1<The following elements have not yet been implemented as of this release:>

Although these elements do not have an explicit constructor, they can be constructed using the $svg->tag(%attra) generic element.

not-yet implemented elements:

altGlyph 
altGlyphDef 
altGlyphItem 
clipPath 
color-profile 
cursor 
definition-src 
font-face-format 
font-face-name 
font-face-src 
font-face-uri 
foreignObject 
glyph 
glyphRef 
hkern 
marker 
mask 
metadata 
missing-glyph 
mpath 
pattern 
switch 
symbol 
textPath 
tref 
tspan 
view 
vkern

2 POD Errors

The following errors were encountered while parsing the POD:

Around line 132:

'=item' outside of any '=over'

=over without closing =back

Around line 633:

Non-ASCII character seen before =encoding in 'qq§text§'. Assuming CP1252