SVG
view release on metacpan or search on metacpan
y => $yv,
-type =>'polygon'
);
my $poly = $svg->polygon(
%$points,
id => 'pgon1',
style => \%polygon_style
);
SEE ALSO:
L<"polyline">, L<"path">, L<"get_path">.
=head2 polyline
$tag = $svg->polyline(%attributes)
Draw an n-point polyline with points defined by a string of the form
'x1,y1,x2,y2,x3,y3,... xy,yn'. The L<"get_path"> method is provided as a
convenience to generate a suitable string from coordinate data.
# 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];
my $points = $svg->get_path(
x => $xv,
y => $yv,
-type => 'polyline',
-closed => 'true' #specify that the polyline is closed.
);
my $tag = $svg->polyline (
%$points,
id =>'pline_1',
style => {
'fill-opacity' => 0,
'stroke' => 'rgb(250,123,23)'
}
);
=head2 line
$tag = $svg->line(%attributes)
Draw a straight line between two points (x1,y1) and (x2,y2).
my $tag = $svg->line(
id => 'l1',
x1 => 0,
y1 => 10,
x2 => 10,
y2 => 0,
);
To draw multiple connected lines, use L<"polyline">.
=head2 text
$text = $svg->text(%attributes)->cdata();
$text_path = $svg->text(-type=>'path');
$text_span = $text_path->text(-type=>'span')->cdata('A');
$text_span = $text_path->text(-type=>'span')->cdata('B');
$text_span = $text_path->text(-type=>'span')->cdata('C');
Define the container for a text string to be drawn in the image.
B<Input:>
-type = path type (path | polyline | polygon)
-type = text element type (path | span | normal [default])
my $text1 = $svg->text(
id => 'l1',
x => 10,
y => 10
)->cdata('hello, world');
my $text2 = $svg->text(
id => 'l1',
x => 10,
y => 10,
-cdata => 'hello, world',
);
my $text = $svg->text(
id => 'tp',
x => 10,
y => 10,
-type => path,
)
->text(id=>'ts' -type=>'span')
->cdata('hello, world');
SEE ALSO:
L<"desc">, L<"cdata">.
=head2 title
$tag = $svg->title(%attributes)
Generate the title of the image.
my $tag = $svg->title(id=>'document-title')->cdata('This is the title');
=head2 desc
$svg->desc(id => 'image-description')->cdata('This image shows a red circle');
Add a description element to the SVG document. The <desc> element provides a
text-accessible description of the container or graphics element. It is
primarily used for accessibility (screen readers) and is not rendered visually.
=head2 comment
$svg->comment('Single comment');
$svg->comment('Part 1', 'Part 2', 'Part 3');
Add a comment to the SVG document. Comments are rendered as standard XML
comments. If multiple strings are provided, they are concatenated with
spaces. Unlike the 'desc' element, comments are generally ignored by user
agents and are not part of the DOM tree for accessibility.
=head2 pi (Processing Instruction)
$tag = $svg->pi(@pi)
Generate a set of processing instructions
my $tag = $svg->pi('instruction one','instruction two','instruction three');
returns:
<lt>?instruction one?<gt>
<lt>?instruction two?<gt>
<lt>?instruction three?<gt>
=head2 script
$tag = $svg->script(%attributes)
Generate a script container for dynamic (client-side) scripting using
ECMAscript, Javascript or other compatible scripting language.
my $tag = $svg->script(-type=>"text/ecmascript");
#or my $tag = $svg->script();
#note that type ecmascript is not Mozilla compliant
# populate the script tag with cdata
# be careful to manage the javascript line ends.
# Use qq{text} or q{text} as appropriate.
# make sure to use the CAPITAL CDATA to poulate the script.
$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
}
});
=head2 path
$tag = $svg->path(%attributes)
Draw a path element. The path vertices may be provided as a parameter or
calculated using the L<"get_path"> method.
# 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 = $svg->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' => 'green',
'stroke' => 'rgb(250,123,23)'
}
);
SEE ALSO: L<"get_path">.
=head2 get_path
$path = $svg->get_path(%attributes)
Returns the text string of points correctly formatted to be incorporated into
the multi-point SVG drawing object definitions (path, polyline, polygon)
B<Input:> attributes including:
-type = path type (path | polyline | polygon)
x = reference to array of x coordinates
y = reference to array of y coordinates
B<Output:> a hash reference consisting of the following key-value pair:
points = the appropriate points-definition string
-type = path|polygon|polyline
dur => "15s",
repeatDur => 'indefinite',
);
$an_ellipse-> animate(
attributeName=>"rx",values=>"30;75;10;100;20;20;150",
dur=>"20s", repeatDur=>'indefinite');
$an_ellipse-> animate(
attributeName=>"fill",values=>"red;green;blue;cyan;yellow",
dur=>"5s", repeatDur=>'indefinite');
$an_ellipse-> animate(
attributeName=>"fill-opacity",values=>"0;1;0.5;0.75;1",
dur=>"20s",repeatDur=>'indefinite');
$an_ellipse-> animate(
attributeName=>"stroke-width",values=>"1;3;2;10;5",
dur=>"20s",repeatDur=>'indefinite');
=head2 group
$tag = $svg->group(%attributes)
Define a group of objects with common properties. Groups can have style,
animation, filters, transformations, and mouse actions assigned to them.
$tag = $svg->group(
id => 'xvs000248',
style => {
'font' => [ qw( Arial Helvetica sans ) ],
'font-size' => 10,
'fill' => 'red',
},
transform => 'rotate(-45)'
);
=head2 defs
$tag = $svg->defs(%attributes)
define a definition segment. A Defs requires children when defined using SVG.pm
$tag = $svg->defs(id => 'def_con_one',);
=head2 style
$svg->tag('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.
$tag = $SVG->style(%attributes)
Generate a style container for inline or xlink:href based styling instructions
my $tag = $SVG->style(type=>"text/css");
# Populate the style tag with cdata.
# Be careful to manage the line ends.
# Use qq{text}, where text is the script
$tag1->CDATA(qq{
rect fill:red;stroke:green;
circle fill:red;stroke:orange;
ellipse fill:none;stroke:yellow;
text fill:black;stroke:none;
});
# Create a external CSS stylesheet reference
my $tag2 = $SVG->style(type=>"text/css", -href="/resources/example.css");
=head2 mouseaction
$svg->mouseaction(%attributes)
Sets/Adds mouse action definitions for tag
=head2 attrib
$svg->attrib($name, $value)
Sets/adds attributes of an element.
Retrieve an attribute:
$svg->attrib($name);
Set a scalar attribute:
$SVG->attrib $name, $value
Set a list attribute:
$SVG->attrib $name, \@value
Set a hash attribute (i.e. style definitions):
$SVG->attrib $name, \%value
Remove an attribute:
$svg->attrib($name,undef);
B<Aliases:> attr attribute
Sets/replaces attributes for a tag.
=head2 cdata
$svg->cdata($text)
Sets cdata to $text. SVG.pm allows you to set cdata for any tag. If the tag is
meant to be an empty tag, SVG.pm will not complain, but the rendering agent will
fail. In the SVG DTD, cdata is generally only meant for adding text or script
content.
$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!');
B<Result:>
<text style="font: Arial; font-size: 20">SVG.pm is a perl module on CPAN!</text>
SEE ALSO:
L<"CDATA">, L<"desc">, L<"title">, L<"text">, L<"script">.
=head2 cdata_noxmlesc
$script = $svg->script();
$script->cdata_noxmlesc($text);
Generates cdata content for text and similar tags which do not get xml-escaped.
In othe words, does not parse the content and inserts the exact string into the cdata location.
=head2 CDATA
$script = $svg->script();
$script->CDATA($text);
Generates a <![CDATA[ ... ]]> tag with the contents of $text rendered exactly as supplied. SVG.pm allows you to set cdata for any tag. If the tag is
meant to be an empty tag, SVG.pm will not complain, but the rendering agent will
fail. In the SVG DTD, cdata is generally only meant for adding text or script
content.
my $text = qq{
var SVGDoc;
var groups = new Array();
var last_group;
/*****
*
* init
*
* Find this SVG's document element
* Define members of each group by id
*
*****/
function init(e) {
SVGDoc = e.getTarget().getOwnerDocument();
append_group(1, 4, 6); // group 0
append_group(5, 4, 3); // group 1
append_group(2, 3); // group 2
}};
$svg->script()->CDATA($text);
B<Result:>
E<lt>script E<gt>
<gt>![CDATA[
var SVGDoc;
var groups = new Array();
var last_group;
/*****
*
* init
*
* Find this SVG's document element
* Define members of each group by id
*
*****/
function init(e) {
SVGDoc = e.getTarget().getOwnerDocument();
append_group(1, 4, 6); // group 0
append_group(5, 4, 3); // group 1
append_group(2, 3); // group 2
}
]]E<gt>
SEE ALSO: L<"cdata">, L<"script">.
=head2 xmlescp and xmlescape
$string = $svg->xmlescp($string)
$string = $svg->xmlesc($string)
$string = $svg->xmlescape($string)
SVG module does not xml-escape characters that are incompatible with the XML specification. B<xmlescp> and B<xmlescape> provides this functionality. It is a helper function which generates an XML-escaped string for reserved characters such as ampersa...
The behaviour of xmlesc is to apply the following transformation to the input string $s:
$s=~s/&(?!#(x\w\w|\d+?);)/&/g;
$s=~s/>/>/g;
$s=~s/</</g;
$s=~s/\"/"/g;
$s=~s/\'/'/g;
$s=~s/([\x00-\x08\x0b\x1f])/''/eg;
$s=~s/([\200-\377])/'&#'.ord($1).';'/ge;
=head2 filter
$tag = $svg->filter(%attributes)
Generate a filter. Filter elements contain L<"fe"> filter sub-elements.
my $filter = $svg->filter(
filterUnits=>"objectBoundingBox",
x=>"-10%",
y=>"-10%",
width=>"150%",
height=>"150%",
filterUnits=>'objectBoundingBox'
);
$filter->fe();
SEE ALSO: L<"fe">.
=head2 fe
$tag = $svg->fe(-type=>'type', %attributes)
Generate a filter sub-element. Must be a child of a L<"filter"> element.
my $fe = $svg->fe(
-type => 'DiffuseLighting' # required - element name omitting 'fe'
id => 'filter_1',
style => {
'font' => [ qw(Arial Helvetica sans) ],
'font-size' => 10,
'fill' => 'red',
},
transform => 'rotate(-45)'
);
Note that the following filter elements are currently supported:
Also note that the elelemts are defined in lower case in the module, but as of version 2.441, any case combination is allowed.
( run in 1.014 second using v1.01-cache-2.11-cpan-d8267643d1d )