Chapter 11: Embedded Content

Contents

• • 11.1. Overview
  • 11.2. Placement and scaling of the referenced resource
  • 11.3. The ‘image’ element
  • 11.4. The ‘video’ element
  • 11.5. The ‘audio’ element
  • 11.6. The ‘iframe’ element
  • 11.7. The ‘canvas’ element
  • 11.8. Foreign namespaces and private data
  • 11.9. Embedding foreign object types
  • 11.10. The ‘foreignObject’ element
  • 11.11. The ‘source’ element
  • 11.12. The ‘track’ element
  • 11.13. DOM interfaces
    • 11.13.1. Interface SVGImageElement
    • 11.13.2. Interface SVGVideoElement
    • 11.13.3. Interface SVGAudioElement
    • 11.13.4. Interface SVGIframeElement
    • 11.13.5. Interface SVGCanvasElement
    • 11.13.6. Interface SVGForeignObjectElement
    • 11.13.7. Interface SVGSourceElement
    • 11.13.8. Interface SVGTrackElement

11.1. Overview

SVG supports embedded content similar to the HTML5's embedded content. Embedded content is content that imports another resource into the document, or content from another vocabulary that is inserted into the document.

The embedded content elements which SVG supports are ‘image’, ‘video’, ‘audio’, ‘iframe’, ‘canvas’ and ‘foreignObject’.

Except ‘canvas’ and ‘foreignObject’, embedded content supports Resource Priorities for hinting of downloading external resources. The normative reference is Resource Priorities.

Stakagi: The current Resource Priorities draft does not support embedded content elements which is going to be added by SVG2.0, such as video. Besides, the consideration for mapping and its tiling use cases may be insufficient. It may be better to describe detailed behavior of Resource Priorities in SVG at SVG specifications.

11.2. Placement and scaling of the referenced resource

Some embedding elements which refer to an external resource establish a new viewport for the referenced content as described in Establishing a new SVG viewport. The bounds for the new viewport are defined by attributes ‘x’, ‘y’, ‘width’ and ‘height’. The placement and scaling of the referenced resource are controlled by the ‘preserveAspectRatio’ attribute on the corresponding element.

Brian: I think it's not obvious that we want to add preserveAspectRatio to these elements since CSS3 Images is trying to define similar functionality. Maybe make this an issue?

Attribute definitions:

Name	Value	Initial value	Animatable
x, y	<length>	0	yes
width, height	<length> | auto	0	yes

The ‘x’, ‘y’, ‘width’ and ‘height’ attributes specify the rectangular region into which the referenced resource is placed.

A negative value for ‘width’ and ‘height’ is invalid (see Error processing). A value of zero for either attribute disables rendering of the element.

The 'auto' value for ‘width’ and ‘height’ is used to size the corresponding element automatically based on the intrinsic size or aspect ratio of the referenced resource. If the intrinsic aspect ratio of the referenced resource is unknown, it is assumed to be 2:1. If the intrinsic size of the referenced resource is unknown, it is assumed to be 300x150, just as is required for CSS replaced elements. If 'auto' is specified for just one of ‘width’ or ‘height’, then the other is determined based on the intrinsic aspect ratio. The automatically determined ‘width’ and ‘height’ values are interpreted as user units, and are reflected in the x and y IDL attributes as SVG_LENGTHTYPE_NUMBER values.

Since the pixel coordinate system which some embedded contents has is not always equivalent SVG coordinate system to embed, ‘canvas’ and ‘iframe’ have intrinsic width and height as ‘canvasWidth’ and ‘canvasHeight’ for ‘canvas’, ‘frameWidth’ and ‘frameHeight’ for ‘iframe’ to assign its intrinsic content size.

11.3. The ‘image’ element

The ‘image’ element indicates that the contents of a complete file are to be rendered into a given rectangle within the current user coordinate system. The ‘image’ element can refer to raster image files such as PNG or JPEG or to files with MIME type of "image/svg+xml". Conforming SVG viewers need to support at least PNG, JPEG and SVG format files.

The result of processing an ‘image’ is always a four-channel RGBA result. When an ‘image’ element references a raster image file such as PNG or JPEG files which only has three channels (RGB), then the effect is as if the object were converted into a 4-channel RGBA image with the alpha channel uniformly set to 1. For a single-channel raster image, the effect is as if the object were converted into a 4-channel RGBA image, where the single channel from the referenced object is used to compute the three color channels and the alpha channel is uniformly set to 1.

When an ‘image’ element references an SVG image, the ‘clip’ and ‘overflow’ properties on the root element in the referenced SVG image are ignored (in the same manner as the ‘x’, ‘y’, ‘width’ and ‘height’ attributes are ignored). Unless the value of ‘preserveAspectRatio’ on the ‘image’ element starts with 'defer', the ‘preserveAspectRatio’ attribute on the root element in the referenced SVG image is also ignored (see ‘preserveAspectRatio’ for details). Instead, the ‘preserveAspectRatio’ attribute on the referencing ‘image’ element defines how the SVG image content is fitted into the viewport and the ‘clip’ and ‘overflow’ properties on the ‘image’ element define how the SVG image content is clipped (or not) relative to the viewport.

Why does it make sense to override ‘clip’ but not ‘clip-path’?

The value of the ‘viewBox’ attribute to use when evaluating the ‘preserveAspectRatio’ attribute is defined by the referenced content. For content that clearly identifies a viewBox (e.g. an SVG file with the ‘viewBox’ attribute on the outermost svg element) that value should be used. For most raster content (PNG, JPEG) the bounds of the image should be used (i.e. the ‘image’ element has an implicit ‘viewBox’ of '0 0 raster-image-width raster-image-height'). Where no value is readily available (e.g. an SVG file with no ‘viewBox’ attribute on the outermost svg element) the ‘preserveAspectRatio’ attribute is ignored, and only the translation due to the ‘x’ & ‘y’ attributes of the viewport is used to display the content.

We should say how the use of an #xywh media fragment interacts with the the above.

For example, if the image element referenced a PNG or JPEG and preserveAspectRatio="xMinYMin meet", then the aspect ratio of the raster would be preserved (which means that the scale factor from image's coordinates to current user space coordinates would be the same for both X and Y), the raster would be sized as large as possible while ensuring that the entire raster fits within the viewport, and the top/left of the raster would be aligned with the top/left of the viewport as defined by the attributes ‘x’, ‘y’, ‘width’ and ‘height’ on the ‘image’ element.  If the value of ‘preserveAspectRatio’ was 'none' then aspect ratio of the image would not be preserved. The image would be fitted such that the top/left corner of the raster exactly aligns with coordinate (‘x’, ‘y’) and the bottom/right corner of the raster exactly aligns with coordinate (‘x’+‘width’, ‘y’+‘height’).

The resource referenced by the ‘image’ element represents a separate document which generates its own parse tree and document object model (if the resource is XML). Thus, there is no inheritance of properties into the image.

Unlike ‘use’, the ‘image’ element cannot reference elements within an SVG file.

Attribute definitions:

Name	Value	Initial value	Animatable
crossorigin	[ anonymous | use-credentials ]	anonymous	yes

The crossorigin attribute is a CORS settings attribute, and unless otherwise specified follows the same processing rules as in html [HTML].

Name	Value	Initial value	Animatable
href	URL [URL]	(none)	yes

An URL reference identifying the image to render. Refer to the common handling defined for URL reference attributes and deprecated XLink attributes.

To get the referenced resource, do a potentially CORS-enabled fetch of the absolute URL that resulted from the earlier step, with the mode being the current state of the element's ‘crossorigin’ attribute, the origin being the origin of the ‘image’ element's Document, and the default origin behaviour set to taint. For origin, the rules defined for the html 'img' element apply the same way to the svg ‘image’ element.

Name	Value	Initial value	Animatable
preserveAspectRatio	defer? <align> [ meet | slice ]?	xMidYMid meet	yes

Specifies the fitting behavior when the aspect ratio of the referenced image does not match the aspect ratio of the rectangle it is placed in. See the definition of ‘preserveAspectRatio’ for details.

An example:

<?xml version="1.0" standalone="no"?>
<svg width="4in" height="3in"
     xmlns="http://www.w3.org/2000/svg">
  <desc>This graphic links to an external image
  </desc>
  <image x="200" y="200" width="100px" height="100px"
         href="myimage.png">
    <title>My image</title>
  </image>
</svg>

11.4. The ‘video’ element

The ‘video’ element introduces the function that is almost equivalent to 'video' element of html5.0 into svg. But, from the difference of the model of svg and html, it has some differences. This chapter describe them mainly. Therefore, except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the 'video' element of html5.0.

To refer a video resource, 'video' element uses ‘src’ attribute insted of 'href'.

Placement of video resources is established in accordance with Placement and scaling of the referenced resource using ‘x’, ‘y’, ‘width’, ‘height’ and ‘preserveAspectRatio’ attributes.

11.5. The ‘audio’ element

The ‘audio’ element introduces the function that is almost equivalent to 'audio' element of html5.0 into svg. Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the 'audio' element of html5.0. The 'audio' element is not rendered on screen unless it has 'controls' boolean attribute of true.

If ‘controls’ boolean attribute is present, the ‘x’, ‘y’ attributes specify the upper left corner of built-in controller. Otherwise those attributes has no effects.

11.6. The ‘iframe’ element

The ‘iframe’ element introduces the function that is almost equivalent to 'iframe' element of html5.0 into svg. Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the 'iframe' element of html5.0.

The ‘iframe’ element introduces a new nested browsing context. Placement of browsing context is established in accordance with placement and scaling of the referenced resource using ‘x’, ‘y’, ‘width’, ‘height’, ‘frameWidth’, ‘frameHeight’ and ‘preserveAspectRatio’ attributes.

The ‘frameWidth’ and ‘frameHeight’ specifies the natural (intrinsic) size (dimension) of browsing context(in CSS pixel) in non negative value. Unlike from ‘canvas’, floating point values are acceptable as intrinsic width and height. (See also CSS Image Values and Replaced Content Module Level 4 #sizing)

If ‘frameWidth’ or ‘frameHeight’ attributes are not specified, values of ‘width’ or ‘height’ are assigned to corresponding DOM attributes.

Are 'frameWidth' and 'frameHeight' really required? They may only be the same as 'width' and 'height'.

Differ from ‘image’ element, even if ‘iframe’ element references an SVG document, placement and scaling is achieved toward browsing context based on its intrinsic size. After that, referred SVG document will be arranged based on initial viewport establishment process for browsing context.

Attribute definitions:

Name	Value	Initial value	Animatable
frameWidth	<length>	0	yes
frameHeight	<length>	0	yes

11.7. The ‘canvas’ element

The ‘canvas’ element introduces the function that is almost equivalent to 'canvas' element of html5.0 into svg. Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the 'canvas' element of html5.0.

The ‘canvasWidth’ and ‘canvasHeight’ specifies the natural size(dimension) of canvas object in non negative integer. Therefore it corresponds to html:canvas's 'width' and 'height'. (See also CSS Image Values and Replaced Content Module Level 4 #sizing)

On the other hand, ‘x’, ‘y’, ‘width’ and ‘height’ attributes specify the rectangular region into which the canvas object is placed considering ‘preserveAspectRatio’ attribute in accordance with Placement and scaling of the referenced resource.

If ‘canvasWidth’ or ‘canvasHeight’ are not specified, INT(‘width’) or INT(‘height’) are assigned to corresponding DOM attributes. In this case, if ‘width’ or ‘height’ is less than 1 , then the canvas object is not generated.

Attribute definitions:

Name	Value	Initial value	Animatable
canvasWidth	<length>	0	yes
canvasHeight	<length>	0	yes

11.8. Foreign namespaces and private data

SVG allows inclusion of elements from foreign namespaces anywhere with the SVG content. In general, the SVG user agent will include the unknown elements in the DOM but will otherwise ignore unknown elements. (The notable exception is described under Embedding Foreign Object Types.)

Additionally, SVG allows inclusion of attributes from foreign namespaces on any SVG element. The SVG user agent will include unknown attributes in the DOM but with otherwise ignore unknown attributes.

SVG's ability to include foreign namespaces can be used for the following purposes:

• Application-specific information so that authoring applications can include model-level data in the SVG content to serve their "roundtripping" purposes (i.e., the ability to write, then read a file without loss of higher-level information).
• Supplemental data for extensibility. For example, suppose you have an extrusion extension which takes any 2D graphics and extrudes it in three dimensions. When applying the extrusion extension, you probably will need to set some parameters. The parameters can be included in the SVG content by inserting elements from an extrusion extension namespace.

To illustrate, a business graphics authoring application might want to include some private data within an SVG document so that it could properly reassemble the chart (a pie chart in this case) upon reading it back in:

<?xml version="1.0" standalone="yes"?>
<svg width="4in" height="3in"
     xmlns = 'http://www.w3.org/2000/svg'>
  <defs>
    <myapp:piechart xmlns:myapp="http://example.org/myapp"
                    title="Sales by Region">
      <myapp:pieslice label="Northern Region" value="1.23"/>
      <myapp:pieslice label="Eastern Region" value="2.53"/>
      <myapp:pieslice label="Southern Region" value="3.89"/>
      <myapp:pieslice label="Western Region" value="2.04"/>
      <!-- Other private data goes here -->
    </myapp:piechart>
  </defs>
  <desc>This chart includes private data in another namespace
  </desc>
  <!-- In here would be the actual SVG graphics elements which
       draw the pie chart -->
</svg>

11.9. Embedding foreign object types

One goal for SVG is to provide a mechanism by which other XML language processors can render into an area within an SVG drawing, with those renderings subject to the various transformations and compositing parameters that are currently active at a given point within the SVG content tree. One particular example of this is to provide a frame for XML content styled with CSS or XSL so that dynamically reflowing text (subject to SVG transformations and compositing) could be inserted into the middle of some SVG content. Another example is inserting a MathML expression into an SVG drawing [MATHML].

The ‘foreignObject’ element allows for inclusion of a foreign namespace which has its graphical content drawn by a different user agent. The included foreign graphical content is subject to SVG transformations, filters, clipping, masking and compositing.

The contents of ‘foreignObject’ are assumed to be from a different namespace. Any SVG elements within a ‘foreignObject’ will not be drawn, except in the situation where a properly defined SVG subdocument with a proper ‘xmlns’ (see Namespaces in XML [XML-NS]) attribute specification is embedded recursively. One situation where this can occur is when an SVG document fragment is embedded within another non-SVG document fragment, which in turn is embedded within an SVG document fragment (e.g., an SVG document fragment contains an XHTML document fragment which in turn contains yet another SVG document fragment).

Usually, a ‘foreignObject’ will be used in conjunction with the ‘switch’ element and the ‘requiredExtensions’ attribute to provide proper checking for user agent support and provide an alternate rendering in case user agent support is not available.

11.10. The ‘foreignObject’ element

The ‘x’ and ‘y’ attributes define the coordinates of the left and top edges of the 'foreignObject', in the current user coordinate system.

The ‘width’ and ‘height’ attributes define width and height of the 'foreignObject' respectively. A negative value for either attribute is an error (see Error processing). A value of zero for either attribute disables rendering of the element.

An example:

<?xml version="1.0" standalone="yes"?>
<svg width="4in" height="3in"
 xmlns = 'http://www.w3.org/2000/svg'>
  <desc>This example uses the 'switch' element to provide a
        fallback graphical representation of an paragraph, if
        XMHTML is not supported.</desc>
  <!-- The 'switch' element will process the first child element
       whose testing attributes evaluate to true.-->
  <switch>
    <!-- Process the embedded XHTML if the requiredExtensions attribute
         evaluates to true (i.e., the user agent supports XHTML
         embedded within SVG). -->
    <foreignObject width="100" height="50"
                   requiredExtensions="http://example.com/SVGExtensions/EmbeddedXHTML">
      <!-- XHTML content goes here -->
      <body xmlns="http://www.w3.org/1999/xhtml">
        <p>Here is a paragraph that requires word wrap</p>
      </body>
    </foreignObject>
    <!-- Else, process the following alternate SVG.
         Note that there are no testing attributes on the 'text' element.
         If no testing attributes are provided, it is as if there
         were testing attributes and they evaluated to true.-->
    <text font-size="10" font-family="Verdana">
      <tspan x="10" y="10">Here is a paragraph that</tspan>
      <tspan x="10" y="20">requires word wrap.</tspan>
    </text>
  </switch>
</svg>

It is not required that SVG user agent support the ability to invoke other arbitrary user agents to handle embedded foreign object types; however, all conforming SVG user agents would need to support the ‘switch’ element and must be able to render valid SVG elements when they appear as one of the alternatives within a ‘switch’ element.

Ultimately, it is expected that commercial Web browsers will support the ability for SVG to embed content from other XML grammars which use CSS or XSL to format their content, with the resulting CSS- or XSL-formatted content subject to SVG transformations and compositing. At this time, such a capability is not a requirement.

11.11. The ‘source’ element

The source element allows authors to specify multiple alternative media resources for media elements. Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the 'source' element of html5.0.

11.12. The ‘track’ element

The track element allows authors to specify explicit external timed text tracks for media elements. Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the 'track' element of html5.0.

11.13. DOM interfaces

11.13.1. Interface SVGImageElement

The SVGImageElement interface corresponds to the ‘image’ element.

interface SVGImageElement : SVGGraphicsElement {
  readonly attribute SVGAnimatedLength x;
  readonly attribute SVGAnimatedLength y;
  readonly attribute SVGAnimatedLength width;
  readonly attribute SVGAnimatedLength height;
  readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio;
  attribute DOMString crossOrigin;
};

SVGImageElement implements SVGURIReference;

Attributes:

x (readonly SVGAnimatedLength)

Corresponds to attribute ‘x’ on the given ‘image’ element.

y (readonly SVGAnimatedLength)

Corresponds to attribute ‘y’ on the given ‘image’ element.

width (readonly SVGAnimatedLength)

Corresponds to attribute ‘width’ on the given ‘image’ element.

height (readonly SVGAnimatedLength)

Corresponds to attribute ‘height’ on the given ‘image’ element.

preserveAspectRatio (readonly SVGAnimatedPreserveAspectRatio)

Corresponds to attribute ‘preserveAspectRatio’ on the given ‘image’ element.

crossOrigin (DOMString)

The crossOrigin IDL attribute must reflect the ‘crossorigin’ attribute on the given ‘image’ element, limited to only known values.

11.13.2. Interface SVGVideoElement

The SVGVideoElement interface corresponds to the ‘video’ element. This interface introduces the function that is almost equivalent to 'HTMLVideoElement' interface of html5.0 into svg.

interface SVGVideoElement : SVGGraphicsElement {
  readonly attribute SVGAnimatedLength x;
  readonly attribute SVGAnimatedLength y;
  readonly attribute SVGAnimatedLength width;
  readonly attribute SVGAnimatedLength height;
  readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio;
};
SVGVideoElement implements HTMLVideoElement;

Attributes:

x (readonly SVGAnimatedLength)

Corresponds to attribute ‘x’ on the given ‘video’ element.

y (readonly SVGAnimatedLength)

Corresponds to attribute ‘y’ on the given ‘video’ element.

width (readonly SVGAnimatedLength)

Corresponds to attribute ‘width’ on the given ‘video’ element.

height (readonly SVGAnimatedLength)

Corresponds to attribute ‘height’ on the given ‘video’ element.

preserveAspectRatio (readonly SVGAnimatedPreserveAspectRatio)

Corresponds to attribute ‘preserveAspectRatio’ on the given ‘video’ element.

11.13.3. Interface SVGAudioElement

The SVGAudioElement interface corresponds to the ‘audio’ element. This interface introduces the function that is almost equivalent to 'HTMLAudioElement' interface of html5.0 into svg.

interface SVGAudioElement : SVGGraphicsElement {
  readonly attribute SVGAnimatedLength x;
  readonly attribute SVGAnimatedLength y;
};
SVGAudioElement implements HTMLAudioElement;

Attributes:

x (readonly SVGAnimatedLength)

Corresponds to attribute ‘x’ on the given ‘audio’ element.

y (readonly SVGAnimatedLength)

Corresponds to attribute ‘y’ on the given ‘audio’ element.

11.13.4. Interface SVGIframeElement

The SVGIframeElement interface corresponds to the ‘iframe’ element. This interface introduces the function that is almost equivalent to 'HTMLIframeElement' interface of html5.0 into svg.

interface SVGIframeElement : SVGGraphicsElement {
  readonly attribute SVGAnimatedLength x;
  readonly attribute SVGAnimatedLength y;
  readonly attribute SVGAnimatedLength width;
  readonly attribute SVGAnimatedLength height;
  readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio;
  readonly attribute SVGAnimatedLength frameWidth;
  readonly attribute SVGAnimatedLength frameHeight;
};

SVGIframeElement implements HTMLIframeElement;

Attributes:

x (readonly SVGAnimatedLength)

Corresponds to attribute ‘x’ on the given ‘iframe’ element.

y (readonly SVGAnimatedLength)

Corresponds to attribute ‘y’ on the given ‘iframe’ element.

width (readonly SVGAnimatedLength)

Corresponds to attribute ‘width’ on the given ‘iframe’ element.

height (readonly SVGAnimatedLength)

Corresponds to attribute ‘height’ on the given ‘iframe’ element.

preserveAspectRatio (readonly SVGAnimatedPreserveAspectRatio)

Corresponds to attribute ‘preserveAspectRatio’ on the given ‘iframe’ element.

frameWidth (readonly SVGAnimatedLength)

Corresponds to attribute ‘frameWidth’ on the given ‘iframe’ element.

frameHeight (readonly SVGAnimatedLength)

Corresponds to attribute ‘frameHeight’ on the given ‘iframe’ element.

11.13.5. Interface SVGCanvasElement

The SVGCanvasElement interface corresponds to the ‘canvas’ element. This interface introduces the function that is almost equivalent to 'HTMLCanvasElement' interface of html5.0 into svg.

interface SVGCanvasElement : SVGGraphicsElement {
  readonly attribute SVGAnimatedLength x;
  readonly attribute SVGAnimatedLength y;
  readonly attribute SVGAnimatedLength width;
  readonly attribute SVGAnimatedLength height;
  readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio;
  readonly attribute SVGAnimatedLength canvasWidth;
  readonly attribute SVGAnimatedLength canvasHeight;
};
SVGCanvasElement implements HTMLCanvasElement;

Attributes:

x (readonly SVGAnimatedLength)

Corresponds to attribute ‘x’ on the given ‘canvas’ element.

y (readonly SVGAnimatedLength)

Corresponds to attribute ‘y’ on the given ‘canvas’ element.

width (readonly SVGAnimatedLength)

Corresponds to attribute ‘width’ on the given ‘canvas’ element.

height (readonly SVGAnimatedLength)

Corresponds to attribute ‘height’ on the given ‘canvas’ element.

preserveAspectRatio (readonly SVGAnimatedPreserveAspectRatio)

Corresponds to attribute ‘preserveAspectRatio’ on the given ‘canvas’ element.

canvasWidth (readonly SVGAnimatedLength)

Corresponds to attribute INT(‘canvasWidth’) on the given ‘canvas’ element.

canvasHeight (readonly SVGAnimatedLength)

Corresponds to attribute INT(‘canvasHeight’) on the given ‘canvas’ element.

11.13.6. Interface SVGForeignObjectElement

interface SVGForeignObjectElement : SVGGraphicsElement {
  readonly attribute SVGAnimatedLength x;
  readonly attribute SVGAnimatedLength y;
  readonly attribute SVGAnimatedLength width;
  readonly attribute SVGAnimatedLength height;
};

Attributes:

x (readonly SVGAnimatedLength)

Corresponds to attribute ‘x’ on the given ‘foreignObject’ element.

y (readonly SVGAnimatedLength)

Corresponds to attribute ‘y’ on the given ‘foreignObject’ element.

width (readonly SVGAnimatedLength)

Corresponds to attribute ‘width’ on the given ‘foreignObject’ element.

height (readonly SVGAnimatedLength)

Corresponds to attribute ‘height’ on the given ‘foreignObject’ element.

11.13.7. Interface SVGSourceElement

The SVGSourceElement interface corresponds to the ‘source’ element. This interface introduces the function that is almost equivalent to 'HTMLSourceElement' interface of html5.0 into svg.

interface SVGSourceElement : SVGElement { };
SVGSourceElement implements HTMLSourceElement;

11.13.8. Interface SVGTrackElement

The SVGTrackElement interface corresponds to the ‘track’ element. This interface introduces the function that is almost equivalent to 'HTMLTrackElement' interface of html5.0 into svg.

interface SVGTrackElement : SVGElement { };
SVGTrackElement implements HTMLTrackElement;