API Documentation
With this API I hope it is much easier to generate HTML for SVG. Please try it and give me feedback.¶

How to work with this API?
It would be good to work with an IDE like Netbeans or Eclipse. In this case you can use method autocomplete. You want to create a new grafical form? So begin typing "create" and autocomplete gives you a list like:

• createRect
• createCircle
• createEllipse
• ...

All allowed attributes for choosen grafic form can be set by an equal setter method. You want to set the horizontal position of a circle object (cx)? Use setCx([value]).

CSS or Style
CSS and Style is a little bit different. All Styles which are also allowed by CSS2 are contained in an own object called "CSS". All Styles which are only available for SVG are called "Style". So...if you want to set style "font" you will find it in CSS-Object. Object filling "fill" is not available for CSS2, so you find it in Style-Object¶

How to start
Create an instance of Tx_Sfsvgapi_Lib_Svgapi or use dependency injection if you're using extbase:¶

/**
 * inject Svgapi
 *
 * @param Tx_Sfsvgapi_Lib_Svgapi $svg
 * @return void
 */
public function injectSvgApi(Tx_Sfsvgapi_Lib_Svgapi $svg) {
    $this->svg = $svg;
}

Now you should set some default values for SVG like width and height:

$this->svg->setHeight(300);
$this->svg->setWidth(400);

Sample

// initialize SVG
$this->svg->setHeight(300);
$this->svg->setWidth(400);

$circle1 = $this->svg->createCircle()
    ->setCx(100)
    ->setCy(50)
    ->setR(20)
    ->setStyle()
        ->setFill('#FF0000')
        ->setOpacity('0.3')
        ->end()
    ->setCss()
        ->setVisibility('visible')
        ->end();
$this->svg->add($circle1);

$text = $this->svg->createText()
    ->setX(10)
    ->setY(40)
    ->setChild('Hello everybody')
    ->setCss()
        ->setFontFamily('Arial')
        ->setFontSize('12')
        ->end();
$this->svg->add($text);

// get svg code and assign it to a fluid var
$this->view->assign('svg', $this->svg->getSvg());