Class: SVG

Classes

Analemma

Axis

DateRangeSelector

DayLength

Heatmap

HeatmapWeekly

Legend

LinearTimeStep

Path

ProfileEditor

Schedule

ScheduleEditor

SkyDome

SunPath

Tooltip

WindRose

Members

---

:number

DATA_FORMAT_DAILY <static, constant>

Data is formatted as an array[365/366].

Type

• number

---

:number

DATA_FORMAT_DAY_HOUR <static, constant>

Data is formatted as an array[365/366][24].

Type

• number

---

:number

DATA_FORMAT_HOURLY <static, constant>

Data is formatted as an array[8760].

Type

• number

---

:number

DATA_FORMAT_MONTHLY <static, constant>

Data is formatted as an array[12].

Type

• number

---

:number

DATA_FORMAT_UNKNOWN <static, constant>

Not a recognised data format.

Type

• number

---

:number

DRAG_NONE <static, constant>

Use this to ignore all drag interaction.

Type

• number

---

:number

DRAG_PAN <static, constant>

Drag interaction pans the chart when zoomed in.

Use the SHIFT key to select a date range instead.

Type

• number

---

:number

DRAG_RANGE <static, constant>

Drag interaction selects a date range.

Drag left-to-right to zoom in an area of the chart, and right-to-left to zoom out.

Type

• number

---

:number

DRAG_TIME <static, constant>

Drag interaction selects the time of the day.

This setting is only really useful when the range is limited to one or two days worth of hourly data.

Type

• number

---

:number

SELECT_ADD <static, constant>

Drag interaction adds to the current selection set.

Type

• number

---

:number

SELECT_ALL <static, constant>

Special command to select all nodes.

Type

• number

---

:number

SELECT_AUTO <static, constant>

Auto-detect selection based on gesture and direction.

Type

• number

---

:number

SELECT_DEL <static, constant>

Drag interaction removes from the current selection set.

Type

• number

---

:number

SELECT_INV <static, constant>

Drag interaction inverts the state of selected cells.

Type

• number

---

:number

SELECT_NONE <static, constant>

Use this to disable interactive selection.

Type

• number

---

:number

SELECT_REV <static, constant>

Special command to reverse the selection.

Type

• number

---

:boolean

ignoreSelection <static>

A flag used to temporarily prevent user click/tap selection.

This flag is mainly used when popovers and modal dialogs are displayed to prevent the dismissal click from triggering a selection change.

Type

• boolean

---

:string

xmlns <static>

The SVG namespace for creating elements.

Type

• string

Methods

---

addStandardColor(color [, name]) <static>

Adds a new color to the standard color palette.

Colors can be specified as either [r,g,b,a] color arrays with each component in the range 0 to 1, or as CSS-compatible hashed hexadecimal color strings in the form '#C8D9F0'.

Parameters:

Name	Type	Argument	Description
color	Array | string		Either an [r,g,b,a] color array or a hashed hex color string.
name	string	<optional>	An optional name for the new color.

Returns:

Returns the numeric index of the new array item, or -1 if the color is invalid and therefore not added.

Type

number

---

createElem(element_type [, attributes]) <static>

Create a new SVG element of the given type with the right namespace.

NOTE: Use this for all non-textual SVG elements. To create a text node, use the PD.SVG.createText() method.

Parameters:

Name	Type	Argument	Description
element_type	string		The type of the SVG element to create.
attributes	object	<optional>	An optional configuration object containing SVG attributes.

Returns:

Returns the new SVG element.

Type

object

---

createText(text [, attributes]) <static>

Create a new SVG single-line text block with the right namespace.

NOTE: Use this only for single-line text elements. To create non-text nodes, use the PD.SVG.createElem() method.

Parameters:

Name	Type	Argument	Description
text	string		The text string to assign the new node.
attributes	object	<optional>	An optional configuration object containing SVG attributes.

Returns:

Returns the new SVG text element.

Type

object

---

createTextMultiLine(text [, attributes]) <static>

Helper method to create a new SVG text multi-line block with the right namespace.

NOTE: Use this only for complex text elements. To create non-text nodes, use the PD.SVG.createElem() method.

Parameters:

Name	Type	Argument	Description
text	string		The text string to assign the new node.
attributes	object	<optional>	An optional configuration object containing SVG attributes.

Returns:

Returns the new SVG text element.

Type

object

---

empty(elem) <static>

Removes all contents from the given SVG element.

Parameters:

Name	Type	Description
elem	SVGElement	The SVG element to clear.

---

fadeIn(elem) <static>

Helper method to fade the opacity of an SVG element to 1.

To make this a dynamic fade, add the pd-fade class to the element.

Parameters:

Name	Type	Description
elem	SVGElement	The SVG element to fade in.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

fadeOut(elem) <static>

Helper method to fade the opacity of an SVG element to zero.

To make this a dynamic fade, add the pd-fade class to the element.

Parameters:

Name	Type	Description
elem	SVGElement	The SVG element to fade out.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

getDefaultColor() <static>

Retrieves the default color used to indicate invalid palette indices.

The default color is a simple object with two properties:

• hex: A hashed hexadecimal color string suitable for use in CSS styles.
• color: An [r,g,b,a] color array with each component in the range 0 to 1.
• rgb: An [r,g,b] color array with each component in the range 0 to 255.
• name: A human readable name for the color.

Returns:

Returns the default color object.

Type

object

---

getStandardColor(index) <static>

Retrieve an item from the standard color palette.

By default, the standard palette stores 12 base colors designed to contrast when displayed in a visual chart or graph.

Each item in the standard palette is an object with two properties:

• color: An [r,g,b,a] color array with each component in the range 0 to 1.
• hex: A hashed hexadecimal color string suitable for use in CSS styles.

Parameters:

Name	Type	Description
index	number	The index of the required color in the palette.

Returns:

Returns the specified color or a default color if the given index is outside the current palette range.

Type

object

---

getStandardColorNameByHex(colorHex) <static>

Retrieves a Standard color object given it's hex value.

Parameters:

Name	Type	Description
colorHex	string	A hexadecimal color string in the form '#RRGGBB';

Returns:

Returns a matching name if found, or undefined.

Type

string

---

getStandardColorPalette() <static>

Retrieves the set of standard colors.

Each item in the standard palette is an object with three properties:

• hex: A hashed hexadecimal color string suitable for use in CSS styles.
• color: An [r,g,b,a] color array with each component in the range 0 to 1.
• rgb: An [r,g,b] color array with each component in the range 0 to 255.
• name: A human readable name for the color.

Returns:

Returns an array of standard colors.

Type

Array

---

getStandardMonthColor(index) <static>

Retrieve an item from the monthly color palette

Parameters:

Name	Type	Description
index	number	The index of the desired month's color (starting at zero). Any index larger than 11 will be reduced to index modulo 12.

Returns:

Returns an [r,g,b,a] color array.

Type

Array

---

getStandardRandomColor() <static>

Grabs a random color from the array of Standard Colors

---

hideElem(elem) <static>

Helper method to hide an SVG element from view.

This method simply sets the display style to none.

Parameters:

Name	Type	Description
elem	SVGElement	The SVG element to hide.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

setAttribute(elem, name, value) <static>

Helper method to set an element attribute.

NOTE: For speed, this method does no testing for valid attributes or values. To remove an attribute, simply set its value to null.

Parameters:

Name	Type	Description
elem	SVGElement	The SVG element to set.
name	string	The name of the SVG attribute.
value	any	The value to set.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

setAttributes(elem [, attributes]) <static>

Helper method to set one or more element attributes.

NOTE: For speed, this method does no testing for valid attributes or values. To remove an attribute, simply set its value to null.

Parameters:

Name	Type	Argument	Description
elem	SVGElement		The SVG element to set.
attributes	object	<optional>	A configuration object containing SVG attributes.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

setStandardColorPalette(array) <static>

Replaces the set of standard colors with the given array.

Colors in the array can be specified as either [r,g,b,a] color arrays with each component in the range 0 to 1, or as CSS-compatible hashed hexadecimal color strings in the form '#C8D9F0'.

Parameters:

Name	Type	Description
array	Array	An array of indexed colors to use as the standard palette.

Returns:

Returns true if the colour palette was successfully set.

Type

boolean

---

setText(elem, text [, attributes]) <static>

Helper method to set the text of an existing text element.

NOTE: For speed, this method does no testing for valid text.

Parameters:

Name	Type	Argument	Description
elem	SVGElement		The SVG element to set.
text	string		The new string value to set the element to.
attributes	object	<optional>	An optional configuration object containing SVG attributes.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

setTextMultiLine(elem, text [, attributes]) <static>

Helper method to set the text lines of an existing text element.

Parameters:

Name	Type	Argument	Description
elem	SVGElement		The SVG element to set.
text	string		The new string value to set the element to.
attributes	object	<optional>	An optional configuration object containing SVG attributes.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

showElem(elem) <static>

Helper method to show an SVG element in the view.

This method simply sets the display style to inline.

Parameters:

Name	Type	Description
elem	SVGElement	The SVG element to show.

Returns:

Returns this PD.SVG object to support method chaining.

Type

object

---

toggleClass(elem, class_name [, state]) <static>

Toggles a class from a HTML/SVG element if it has it.

Parameters:

Name	Type	Argument	Description
elem	object		A HTML/SVG element.
class_name	string | Array		The name of the class to remove, or an array of names.
state	boolean	<optional>	An optional boolean state for the class name(s).

Returns:

Returns this PD.SVG object to support method chaining.

Type

object