3 Basic Data Types and Interfaces
Contents
3.1 Basic data types
The common data types for SVG's properties and attributes fall into the following categories:
-
<angle>:
An angle value is a <number>
optionally followed immediately
with an angle unit identifier. Angle unit identifiers are:
- deg: degrees
- grad: grads
- rad: radians
For properties defined in [CSS2],
an angle unit identifier must be provided.
For SVG-specific attributes and properties,
the angle unit identifier is optional. If not provided,
the angle value is assumed to be in degrees.
The corresponding SVG DOM interface definition for <angle> is
SVGAngle.
-
<color>:
The basic type <color> is a CSS2-compatible specification for a
color in the sRGB color space [SRGB].
<color> applies to
SVG's use of the
'color'
property and is a component of the definitions of properties
'fill',
'stroke' and
'stop-color',
which also offer optional ICC-based color specifications.
A <color> is either a keyword or a numerical RGB specification.
The list of keyword color names is: aqua, black, blue, fuchsia, gray, green,
lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow. These 16
colors are defined in HTML 4.0 ([HTML40]).
The format of an RGB value in hexadecimal notation is a '#' immediately
followed by either three or six hexadecimal characters. The three-digit RGB notation
(#rgb) is converted into six-digit form (#rrggbb) by replicating digits, not by
adding zeros. For example, #fb0 expands to #ffbb00. This ensures that white
(#ffffff) can be specified with the short notation (#fff) and removes any dependencies
on the color depth of the display.
The format of an RGB value in the functional notation is 'rgb(' followed by a
comma-separated list of three numerical values (either three integer values or
three percentage values) followed by ')'. The integer value 255 corresponds to
100%, and to F or FF in the hexadecimal notation: rgb(255,255,255) =
rgb(100%,100%,100%) = #FFF. Whitespace characters are allowed
around the numerical values.
All RGB colors are specified in the sRGB color space
(see [SRGB]). Using
sRGB provides an unambiguous and objectively measurable definition of
of the color,
which can be related to international standards (see
[COLORIMETRY]).
The corresponding SVG DOM interface definitions for <color> are defined in
[DOM2-CSS]; in particular, see the
[DOM2-CSS-RGBCOLOR].
SVG's extension to color, including the ability to specify ICC-based colors,
are represented in DOM interface
SVGColor.
-
<coordinate>:
The format of a <coordinate> is
a <number>
optionally followed
immediately by a CSS unit identifier.
If the <coordinate> is expressed as a simple number without
a CSS unit identifiers (e.g., 48), then
the value represents a coordinate value in the current
user coordinate system.
If one of the CSS unit identifier
is provided (e.g., 12mm),
the <coordinate>
represents the X-coordinate in the user coordinate system that is
the given distance (measured in the viewport coordinate system)
from the origin of the user coordinate system.
(See Processing rules for CSS units and percentages.)
If a percentage is provided (e.g., 10%),
the <coordinate>
represents the X-coordinate in the user coordinate system that is
the given distance (measured as a percentage of the width of the viewport coordinate system)
from the origin of the user coordinate system.
(See Processing rules for CSS units and percentages.)
Within the SVG DOM, a <coordinate> is represented as an
SVGLength
since both values have the same syntax (although the semantics are not identical).
-
<frequency>:
Frequency values are used with aural cascading style sheets
(see [CSS2]).
A frequency value is a <number> immediately followed by a frequency unit identifier.
Frequency unit identifiers are:
- Hz: Hertz
- kHz: kilo Hertz
Frequency values may not be negative.
The corresponding SVG DOM interface definitions for <frequency> are defined in
[DOM2-CSS].
-
<integer>:
An <integer> is specified as
an optional sign character ('+' or '-', with '+' being the default)
followed by one or more digits "0" to "9".
Unless stated otherwise for a particular attribute or property,
the range for a <integer> encompasses (at a minimum) -2147483648 to -2147483647.
Within the SVG DOM, an <integer> is represented as an
SVGInteger.
-
<length>:
A length is a distance measurement.
The format of a <length> is
a <number> optionally followed
immediately by a CSS unit identifier.
(Note that a <number> has
different formulations depending on whether it is applied to a CSS property or
an XML attribute.)
If the <length>
is expressed as a value without
a CSS unit identifiers
(e.g., 48), then
the <length>
represents a distance in the current
user coordinate system.
If one of the CSS unit identifier
is provided (e.g., 12mm),
then the
<length> represents
a width value in the viewport coordinate system.
(See Processing rules for CSS units and percentages.)
If a percentage is provided, (e.g., 10%), then the
given percentage represents a percentage of the width of the viewport.
(See Processing rules for CSS units and percentages.)
Within the SVG DOM, a <length> is represented as an
SVGLength.
-
<list of xxx>
(where xxx represents a value of some type):
A list consists of a separated sequence of values.
The specification of lists is different for CSS property values
than for XML attribute values.
- Lists in CSS property values are comma-separated, with optional
white space
before or after the comma.
- Lists within SVG's XML attributes are either comma-separated, with optional
white space
before or after the comma, or white space-separated.
White space in lists is defined as one or more of the following
consecutive characters: "space" (Unicode code 32), "tab" (9),
"line feed" (10), "carriage return" (13) and "form-feed" (12).
Within the SVG DOM, a <list of xxx> is represented by various custom interfaces,
such as SVGTransformList.
-
<number> (real number value):
The specification of real number values is different for CSS property values
than for XML attribute values.
- CSS2 [CSS2] states that a property value
which is a <number> is specified in decimal notation
(i.e., a <decimal-number>),
which consists of either an <integer>,
or an optional sign character
followed by zero or more digits followed by a dot (.) followed by zero or more digits
with at least one digit required either before or after the dot.
Thus, for conformance with CSS2, any property in SVG which accepts
<number> values is specified in decimal notation only.
- For SVG's XML attributes, to provide as much scalability in numeric values as possible,
real number values can be provided either in
decimal notation
or in
scientific notation
(i.e., a <scientific-number>),
which consists of a <decimal-number>
immediately followed by the letter "e" or "E" immediately followed by an
<integer>.
Unless stated otherwise for a particular attribute or property,
a <number> has the capacity for at least a
single-precision floating point number
(see [ICC32])
and has a range (at a minimum) of -3.4e+38F to +3.4e+38F.
It is recommended that higher precision floating point
storage and computation be performed
on operations such as coordinate system transformations
to provide
the best possible precision and to prevent round-off errors.
Conforming High-Quality SVG Viewers
are required to use at least double-precision floating point
(see [ICC32])
intermediate calculations on certain numerical operations.
Within the SVG DOM, a <number> is represented as an
SVGNumber.
-
<paint> :
The values for properties
'fill' and
'stroke'
are specifications of the type of paint to use when filling or stroking
a given graphics element. The available options and syntax for
<paint> is described in
Specifying paint.
Within the SVG DOM, <paint> is represented as an
SVGPaint.
-
<percentage>:
The format of a percentage value is a
<number> immediately followed by a '%'.
Percentage values are always relative to another value, for example a length.
Each attribute or property that allows percentages also defines the reference
distance measurement to which the percentage refers.
Within the SVG DOM, a <percentage> is represented as an
SVGLength.
-
<time>:
A time value is a <number> immediately followed by a time unit identifier.
Time unit identifiers are:
- ms: milliseconds
- s: seconds
Time values are used in CSS properties and may not be negative.
The corresponding SVG DOM interface definitions for <time> are defined in
[DOM2-CSS].
-
<transform-list> :
The detailed description of the possible values for a <transform-list> are detailed in
Modifying the User Coordinate System: the transform attribute.
Within the SVG DOM, <transform-list> is represented as an
SVGTransformList.
-
<uri> (Uniform Resource Identifiers [URI] references):
A URI is the address of a resource on the Web.
For the specification of URI references in SVG, see
URI references.
Within the SVG DOM, <uri> is represented as a DOMString.
3.2 Basic DOM interfaces
3.2.1 Overview
The section describes the basic DOM interfaces for
SVG's Document Object Model
that are common to multiple parts of the SVG DOM.
Many of these interfaces correspond directly with SVG's
basic data types.
3.2.2 Interface SVGAngle
This interface corresponds to the
<angle> basic data type.
interface SVGAngle {
// Unit Types
const unsigned short kSVG_ANGLETYPE_UNKNOWN = 0; // invalid, must be retrieved as a string
const unsigned short kSVG_ANGLETYPE_UNSPECIFIED = 1 ; // no value provided, default kicks in
const unsigned short kSVG_ANGLETYPE_DEG = 2; // Degrees or unitless (means degrees)
const unsigned short kSVG_ANGLETYPE_RAD = 3;
const unsigned short kSVG_ANGLETYPE_GRAD = 4;
readonly attribute unsigned short unittype;
// Setting any of these causes the other values to
// be updated automatically.
// If kSVG_ANGLETYPE_UNSPECIFIED, these reflect the default value.
attribute float angle; // in degrees
attribute float angleInSpecifiedUnits;
attribute DOMString angleAsString;
// Utility methods
void newAngleSpecifiedUnits(in unsigned short unittype, in float angleInSpecifiedUnits);
void convertToSpecifiedUnits(in unsigned short unittype);
// If this attribute or style property currently is being animated,
// animatedValue reflects the current animated value of the
// attribute or style property.
// Otherwise, when not animated, it will equal 'value'
readonly attribute float animatedValue; // in user units
};
|
3.2.3 Interface SVGInteger
This interface corresponds to the
<integer> basic data type.
interface SVGInteger {
attribute long value;
// If this attribute or style property currently is being animated,
// animatedValue reflects the current animated value of the
// attribute or style property.
// Otherwise, when not animated, it will equal 'value'
readonly attribute float animatedValue;
};
|
3.2.4 Interface SVGLength
This interface corresponds to the
<length> basic data type.
interface SVGLength {
// Unit Types
const unsigned short kSVG_LENGTHTYPE_UNKNOWN = 0; // invalid, must be retrieved as a string
const unsigned short kSVG_LENGTHTYPE_UNSPECIFIED = 1; // no value provided, defaults kick in
const unsigned short kSVG_LENGTHTYPE_NUMBER = 2; // Unitless, meaning user units
const unsigned short kSVG_LENGTHTYPE_PERCENTAGE = 3;
const unsigned short kSVG_LENGTHTYPE_EMS = 4;
const unsigned short kSVG_LENGTHTYPE_EXS = 5;
const unsigned short kSVG_LENGTHTYPE_PX = 6;
const unsigned short kSVG_LENGTHTYPE_CM = 7;
const unsigned short kSVG_LENGTHTYPE_MM = 8;
const unsigned short kSVG_LENGTHTYPE_IN = 9;
const unsigned short kSVG_LENGTHTYPE_PT = 10;
const unsigned short kSVG_LENGTHTYPE_PC = 11;
readonly attribute unsigned short unittype;
// Setting any of these causes the other values to
// be updated automatically.
// If kSVG_LENGTHTYPE_UNSPECIFIED, these reflect the default value.
attribute float value; // in user units
attribute float valueInSpecifiedUnits;
attribute DOMString valueAsString;
// Utility methods
void newValueSpecifiedUnits(in unsigned short unittype, in float valueInSpecifiedUnits);
void convertToSpecifiedUnits(in unsigned short unittype);
// If this attribute or style property currently is being animated,
// animatedValue reflects the current animated value of the
// attribute or style property.
// Otherwise, when not animated, it will equal 'value'
readonly attribute float animatedValue; // in user units
};
|
3.2.5 Interface SVGLengthList
This interface corresponds to values which represent a
list of
<length> values.
interface SVGLengthList {
SVGLength createSVGLength(); // Returns unattached length of 0 user units
readonly attribute unsigned long number_of_lengths;
SVGLength getSVGLength(in unsigned long index);
// Replace all existing entries with a single entry.
void initialize(in SVGLength newSVGLength)
raises(DOMException);
void clear(); // Clear all entries, giving an empty list
SVGLength insertBefore(in SVGLength newSVGLength,
in unsigned long index)
raises(DOMException);
SVGLength replace(in SVGLength newSVGLength,
in unsigned long index)
raises(DOMException);
SVGLength remove(in unsigned long index)
raises(DOMException);
SVGLength append(in SVGLength newSVGLength)
raises(DOMException);
};
|
Used to values that can be expressed as an array of SVGLengths.
3.2.6 Interface SVGNumber
This interface corresponds to the
<number> basic data type.
interface SVGNumber {
attribute float value; // in user units
// If this attribute or style property currently is being animated,
// animatedValue reflects the current animated value of the
// attribute or style property.
// Otherwise, when not animated, it will equal 'value'
readonly attribute float animatedValue; // in user units
};
|
3.2.7 Interface SVGRect
Rectangles are defined as consisting of a (x,y) coordinate pair
identifying a minimum X value, a minimum Y value, and a width and height,
which are usually constrained to be non-negative.
interface SVGRect {
attribute SVGNumber x;
attribute SVGNumber y;
attribute SVGNumber width;
attribute SVGNumber height;
};
|