Olympe SDK

Class: SvgImageBuilder

olympe.ui.vectorial. SvgImageBuilder

Class to build SVG images core side. For now it is very basic, you can draw one path and add text. All texts will share the same font. Built images can then be displayed via the setBackgroundImage method for example :

 var svgImageBuilder = new SvgImageBuilder();
 // ... code to draw the image ...
 myDockable.setBackgroundImage(svgImageBuilder.toDataUrl())

new SvgImageBuilder()

Creates a SVG Image Builder.

Methods

clear()

Removes all content (path segments and texts)

Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

lineTo(x, y)

Draws a straight line from the cursor position to the specified position

Parameters:
Name Type Description
x number

Horizontal coordinate
y number

Vertical coordinate
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

moveTo(x, y)

Moves the cursor to the specified position

Parameters:
Name Type Description
x number

Horizontal coordinate
y number

Vertical coordinate
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

setDimension(width, height)

Sets the image's size

Parameters:
Name Type Description
width number

Image width in pixel
height number

Image height in pixel
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

setFontColor(r, g, b [, a])

Sets all texts font color

Parameters:
Name Type Argument Description
r number

Red component (between 0 and 255)
g number

Green component (between 0 and 255)
b number

Blue component (between 0 and 255)
a number <optional>

Alpha component (between 0 and 1)
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

setFontFamily(family)

Sets texts fonts family

Parameters:
Name Type Description
family string

Font family name
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

setFontSize(size)

Sets texts font size

Parameters:
Name Type Description
size number

Font size
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

setStrokeColor(r, g, b [, a])

Sets the path's stroke color

Parameters:
Name Type Argument Description
r number

Red component (between 0 and 255)
g number

Green component (between 0 and 255)
b number

Blue component (between 0 and 255)
a number <optional>

Alpha component (between 0 and 1)

setStrokeWidth(width)

Sets the path's stroke width

Parameters:
Name Type Description
width number

textAt(x, y, value [, verticalText])

Adds a text at the specified position

Parameters:
Name Type Argument Description
x number

Horizontal coordinate
y number

Vertical coordinate
value string

Text content
verticalText boolean <optional>

If true, text is written vertically (without rotating the letters)
Returns:

The current SvgImageBuilder instance

Type
olympe.ui.vectorial.SvgImageBuilder

toDataUrl()

Returns the built image as a data url.

Returns:
Type
string

toString()

Returns the image as SVG

Returns:
Type
string