Mobile SVG Profiles: SVG Tiny and SVG Basic, Version 1.2

This document defines two mobile profiles of SVG 1.2. The first profile, SVG Tiny 1.2, is defined to be suitable for cellphones; the second profile, SVG Basic 1.2, is suitable for PDAs.

Status of this document

This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at http://www.w3.org/TR/.

This document is the first public working draft of Version 1.2 of the SVG Mobile Profiles: SVG Basic and SVG Tiny.

We explicitly invite comments on this specification. Please send them to www-svg@w3.org: the public email list for issues related to vector graphics on the Web. This list is archived and acceptance of this archiving policy is requested automatically upon first post. To subscribe to this list send an email to www-svg-request@w3.org with the word subscribe in the subject line.

The latest information regarding patent disclosures related to this document is available on the Web. As of this publication, the SVG Working Group are not aware of any royalty-bearing patents they believe to be essential to SVG.

Publication as a Working Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.

Sections highlighted in yellow contains new information relevant to SVG Mobile 1.2. The other sections are unmodified from SVG Mobile 1.1.

1. Introduction

Reading Instructions:
This is the first draft of this specification and large parts of it are not updated from the 1.1 version of the specification. To facilitate for the reader the following color codes have been used to highlight relevant sections:
-Text in a green box (like this one) is used to inform the reader about open/unresolved issues and other relevant information.
-Text in light yellow boxes describes new features in SVGT1.2.
All the text outside of those boxes can possibly be out of date/wrong.

Note that all the appendixes are up to date and contains new 1.2 information.

All the new functionality in this draft is for SVG Tiny 1.2. The Working Group has not decided what to do with regards to SVG Basic 1.2. There has so far been no demand for new SVG Basic features. The proposed solutions are either to not specify SVG Basic 1.2 at all or to specify SVG Basic 1.2 as SVG Tiny 1.2 combined with SVG Basic 1.1.

The SVG Full Working Group are considering to split the svg specification into two branches, image and application. There is still no concensus regarding this. The Mobile subgroup will follow whatever decision the entire group takes. If there will be an image/application split for SVG Full 1.2 there will be the same for the mobile profiles. The difference between image and application is that application will contain scripting functionality.

It has been established by industry demand, overwhelming support in the SVG working group and requests from the SVG developer community that some form of SVG suited to displaying vector graphics on small devices is required. Moreover, the mission statement of SVG 1.0 specifically addresses small devices as a target area for vector graphics display. In order to meet these demands the SVG Working Group has committed to a concerted effort to create a profile specification that addresses mobile devices.

A single such profile is not sufficient to deal with the variety of mobile devices, because each mobile device has different characteristics in terms of CPU speed, memory size, and color support. To address the range of different device families, two profiles are defined. The first low-level profile, SVG Tiny (SVGT) is suitable for highly restricted mobile devices; while the second profile, SVG Basic (SVGB) is targeted for higher level mobile devices.

Because of the low memory, low CPU power and limited display of mobile devices, Mobile SVG profiles introduce constraints on content, attribute types, properties, and user agent behavior. This section describes these constraints and design rationale behind them.

2. Mobile SVG Document Types

SVGT and SVGB consist of the following SVG 1.1 modules. For each module, a given profile might contain the Full version, the subsetted Basic version, or no version of that module. For ease of use, the relevant elements in each module are given; in modules other than Full, not all attributes may be supported and there may be restrictions on attribute values. For details, see the module definitions in the SVG 1.1 specification.

SVG Tiny

SVG Basic

3. Data Types

4. Document Structure

Mobile SVG Document Fragment

SVGB and SVGT content can be in the form of stand-alone SVG Documents or document fragments embedded within a parent XML document. The following is an example of an SVG document fragment embedded within an XHTML 1.1 document:

The 'title', 'desc', 'metadata' Elements

SVGB and SVGT support the 'title', 'desc' and 'metadata' elements as defined in SVG 1.1.

The 'svg' Element

The 'baseProfile' attribute on the outermost 'svg' element must have the value "tiny" for SVG Tiny content, and "basic" for SVG Basic content. The 'baseProfile' attribute on nested child 'svg' elements is ignored. The SVG 1.1 specification states that the 'version' attribute of the outermost 'svg' element in SVG 1.1 content must have the value "1.1".

References and the 'defs' Element

For SVGT, all referenced objects, except on the 'image' and 'a' elements, must be internal (using the 'data:' URL scheme, and base64 encoding). SVGB does not put extra limitations on external references as defined by SVG 1.1.

The 'symbol' Element

The 'use' Element

Note that, in SVG 1.1, animations on a referenced element will cause the instances to be animated. SVGB and SVGT also support this feature.

The 'image' Element

SVGB and SVGT require support of the JPEG and PNG formats on the image element. SVGB also requires support of SVG format on the image element.

The 'switch' Element

SVGT and SVGB support the switch element, to determine which SVG 1.1 features are supported by the user agent.

Progressive Downloading

SVGT 1.2 supports the page and pageSet elements, and streamable attribute as defined in the SVG 1.2 draft

Progressive Rendering

SVGT 1.2 supports the externalResourcesRequired attribute to enable progressive rendering, as defined in the SVG 1.2 draft

Specification of thumbnails

SVG Tiny 1.2 allows content to specify a thumbnail. The group is investigating solutions for this feature.

The 'audio' Element

SVGT 1.2 supports the audio element as defined in the SVG 1.2 draft. SVGT 1.2 allows to switch between different audio formats but will not mandate any audio format.

5. Styling

SVGB allows optional support of CSS Mobile Profile 1.0. SVGT does not support styling with CSS.

SVGB and SVGT can introduce constraints on style properties. Allowed values for style properties are listed in Appendix C.

6. Coordinate Systems, Transformations and Units

SVG Tiny shall support the new transform definition type 'ref(<target>, <x>, <y>)' as defined in the SVG 1.2 specification. SVG Tiny supports only 'host' as a target.

SVGB and SVGT support nesting of transformations. The types of transformations that are allowed are generic transformation matrices, or simple operations such as rotation, scaling, skewing, and translation.

The 'transform' Attribute

SVGB and SVGT support the transform attribute. The following transform definition types are supported:

The 'viewBox' Attribute

SVGB and SVGT fully support the 'viewBox' attribute. SVGT has restrictions on allowed preserveAspectRatio attribute values.

The 'preserveAspectRatio' Attribute

SVGB and SVGT support the 'preserveAspectRatio' attribute for adapting the content to devices with different display aspect ratios.

In SVGT,Â the <align> parameter can only be either 'none' or 'XMidYMid', the <meetOrSlice> parameter can only be 'meet'.

Establishing a New Viewport

SVGB supports establishing a new viewport via additional embedded 'svg' elements. SVGT does not allow nested 'svg' elements.

Units

SVGT supports user units only, except for the 'width' and 'height' attributes on the outermost 'svg' element where CSS units are also supported. SVGB supports both user units and CSS user identifiers.

Object Bounding Box Units

7. Shapes

Paths

SVGB and SVGT support all SVG 1.1 path commands, except the elliptical arc curve command ("A"(absolute) and "a"(relative)).

Basic Shapes

SVGT and SVGB support the basic shapes (rectangles, circles, ellipses, lines, polylines, and polygons) as defined in SVG 1.1.

8. Text

SVGB and SVGT represent text with Unicode characters. Mobile SVG user agents are not required to allow text selection and clipboard operations.

SVGT does not support text on a path, 'tspan' and 'tref' elements. SVGT supports the 'rotate' attribute on the 'text' element, but it should be noted that this may cause a slow down of the user agent's rendering speed, and rotation may not be supported with system fonts.

SVGT enables a block of text to be rendered inside of a rectangle, while automatically wrapping the text into lines using the flowText element.

SVG Tiny shall support the following elements, with the listed restrictions, as specified in the SVG 1.2 Working Draft:

9. Painting: Filling, Stroking and Marker Symbols

SVGB and SVGT support filling and stroking 'path' elements and basic shapes with solid colors.

SVGB supports all features of opacity as defined in SVG 1.2 specification. SVGT supports fill-opacity and stroke-opacity properties only.

SVG Tiny supports the non-scaling stroke as defined in the SVG 1.2 specification.

10. Color

SVGT and SVGB support <color> in the CSS2-compatible specification for a color in the sRGB color space, and system colors. Additionally, SVGB and SVGT support 16 original color keywords from XHTML, and do not support X11 colors.

Specifying colors using an ICC profile is not supported in SVGT; and as with SVG 1.1, it is optional in SVGB.

11. Gradients and Patterns

SVG Tiny 1.2 includes support for a subset of the linearGradient and radialGradient elements. The exact subset of linearGradient and radialGradient supported in SVG Tiny 1.2 will be defined in a subsequent version of the SVG Tiny 1.2 specification.

12. Clipping, Masking and Compositing

SVGB supports clipping, masking and compositing. SVGB does not support additive clipping paths. Also, in SVGB, clipping paths are restricted to rectangles ('rect' elements or references to 'rect' elements through 'use').

13. Filter Effects

14. Interactivity

SVGB and SVGT support the SVG 1.1 events. SVGT only allows interactivity with declarative animation.

SVG Tiny 1.2 supports interactivity through the integration of XMLEvents, as described in : the SVG 1.2 specification

15. Linking

SVGB and SVGT support hyperlink activation from SVG content to other Web resources through the 'a' element.

SVGB supports hyperlink into particular views of SVG content. SVGT does not support this feature.

16. Scripting

If SVG is split into two branches (application/image), scripting support will only be part of the SVGT1.2-Application profile.

SVGB allows optional support of scripting, and includes all of the language features from SVG 1.1 to support scripting.

17. Animation

Both SVGB and SVGT support the full set of SVG 1.1's declarative animation features:

The language features to support animation through scripting and DOM are available in SVGB. SVGT only supports declarative animation.

SVGB and SVGT allow implicit targeting of parent elements, and targeting elements using the 'xlink:href' attribute.

Note: The snapShotTime attribute will be part of the next SVG1.2 full spec. The SVG Tiny spec will in future versions just point to the SVG Full spec for snapShotTime. Until the next SVG1.2 draft is published this section will however remain in the SVG Tiny draft to allow for public feedback.

snapShotTime=<time>

Indicates a moment in time which is most relevant for a still-image of the animated svg content. This time can be used as a hint to the Dynamic Svg Viewer if it needs to render a still-image of the animated SVG. SnapShotTime is an animation-related attribute that only applies to Dynamic Svg Viewers. Static Svg Viewers should ignore this attribute. This attribute will most typically be used when rendering a still-image that serves as a preview of the document. This attribute only applies to the outermost (root) svg element. Animatable: no

18. Fonts

SVGB and SVGT support a subset of SVG fonts where only the 'd' attribute on the 'glyph' and 'missing-glyph' elements is available. Arbitrary SVG within a 'glyph' is not supported.

As with Full SVG 1.1, SVGB supports downloadable fonts using WebFonts facility defined in the "Cascading Style Sheets (CSS) level 2" specification. In SVGT, an SVG font can be only embedded within the same document that uses the font.

19. Metadata

Both SVGB and SVGT support embedded metadata, as well as elements and attributes from foreign namespaces included within the SVG content.

20. Extensibility

The SVG renderer is not expected to be able to render content in foreign namespaces, but the foreignObject element allows a subtree in a foreign namespace to be assigned a width and height and passed off to another renderer.

Author List

The authors of this specification are the participants of the W3C SVG Working Group.

Acknowledgments

The SVG Working Group would like to acknowledge the great many people outside of the SVG Working Group who help with the process of developing the SVG 1.1 and Mobile SVG specification. These people are too numerous to list individually. They include but are not limited to the early implementers of the SVG 1.0 and 1.1 languages and Mobile SVG profiles (including viewers, authoring tools, and server-side transcoders), developers of SVG content, people who have contributed on the www-svg@w3.org and svg-developers@yahoogroups.com email lists, other Working Groups at the W3C, and the W3C team. Mobile SVG is truly a cooperative effort between the SVG Working Group, the rest of the W3C, and the public and benefits greatly from the pioneering work of early implementers and content developers, feedback from the public, and help from the W3C team.

References

Appendix A. UDOM

The current UDOM proposal presented here is not the final solution for an SVG Tiny API. The WG is still discussing this and other proposals and has not reached consensus. The WG has an interest in presenting this proposal to the public and is hoping to get feedback on UDOM from everyone interested in an API for SVG Tiny.

Introduction

Features Support Summary

Feature	Support Options
Document Access	Yes
Tree Navigation (i.e., accessing individual nodes)	Limited to nodes with IDs
Element creation	Yes, but restricted to specific element types
Text Node creation	No (but see Element Creation. <text> elements can be created)
Element addition	Yes, but restricted to specific element types
Element removal	Yes, but restricted to specific element types
Attribute access (read)	Yes, string based and typed
Attribute modification (write)	Yes, string based and typed
Event dispatching	No
Event Creation	No
Event listener registration and removal	Yes
Animation	Yes, allows begin and end on 'indefinite' conditions.

Feature Details

Note: Although the examples in this section are all in java, the UDOM proposal requires no specific language.

Document Access

All proposals assume that a Document object is present and is the root for accessing other features. The way the Document object becomes available depends on the usage context. For example, for code bound to an SVG document through a <handler> element, the Document would be passed to the corresponding XMLEventHandler implementation's init method.

Example:

<svg xmlns:ev="http://www.w3.org/2001/xml-events">

<rect id="myRect" x="10" y="20" width="200" height="300" fill="red"/>

<ev:listener ev:event="click" ev:observer="myRect"
           ev:handler="#myClickHandler" />

<!-- handler would be a new SVG element -->
<handler id="myClickHandler"
     type="application/java"
     xml:base="http://fooCompany.com/myJar.jar"
     xlink:href="#com.fooCompany.MyXMLEventHandler"/>
  <param name="offset" value="10" />
</svg>

with MyXMLEventHandler being:

package com.fooCompany;

import tbd.XMLEventHandler;
import tbd.udom.Document;
import tbd.udom.Element;
import tbd.udom.events.Event;

public class MyXMLEventHandler implements XMLEventHandler {
   Document document;

   public void init(Document doc, Element handlerElement) {
        document = doc;
        // ...
   }

   public void handleEvent(Event event) {
        RectElement myRect = 
              (RectElement)document.getElementById("myRect");
        float width = myRect.getWidth();
        myRect.setWidth(width + 10);
   }
}

In the remainder of this document, the variable 'document' is assumed to be an instance of the Document interface.

Tree Navigation

Tree navigation is the ability to access individual SVG Elements in a document tree.
UDOM gives access to individual elements by identifier. It also allows some navigation of the document tree thanks to the Node's interface. From a Node, it is possible to access its parent Node and to the owner Document node:

Element myRect = document.getElementById("myRect");
Node myRectParent = myRect.getParentNode();
Document doc = myRect.getOwnerDocument();

UDOM also gives access to the Document's root element:

Element svgRoot = document.getDocumentElement();

Element Creation

UDOM allows the creation of new Elements:

Element myRect = document.createElementNS(svgNS, "rect");

Note that there is no support for creating Text nodes. This is done implicitly by setting the content on an SVG <text> element:

TextElement myText 
   = (TextElement)document.createElementNS(svgNS, "text");
myText.setData("Hello UDOM");

The type of elements which can be created through the createElementNS method is restricted to:

The SVG namespace.
The following elements: <rect>, <circle>, <ellipse>, <line>, <polyline>, <polygon>, <path>, <text>, <image> <anchor> and <use>

Element Addition

Node Addition is the ability to add new elements to a document tree.

UDOM allows addition and insertion and insertion of a Node:

// Create a new <rect> element
RectElement myRect 
    = (RectElement)document.createElementNS(svgNS, "rect");

// Set the various <rect> properties before appending
...

// Add element to the root of the document
Element svgRoot = document.getDocumentElement();
svgRoot.appendChild(myRect);

// Create a new <ellipse> element
EllipseElement myEllipse
    = (EllipseElement)document.createElementNS(svgNS, "ellipse");

// Set the various <ellipse> properties before insertion
...

// Insert the ellipse before the rectangle
svgRoot.insertBefore(myEllipse, myRect);

The types of nodes which can be inserted into the Document is limited to the same list specified in the Element Creation section.

Element Removal

Node removal is the ability to remove an element from a document tree.

UDOM allows the removal of Nodes:

Element myRect = ...; // See Element creation
Element myGroup = document.getElementById("myGroup");
myGroup.appendChild(myRect);
....
myGroup.removeChild(myRect);

However, the API limits the removal of nodes to nodes which were added to the document tree by a prior call to insertBefore or appendChild.

Attribute Access

Attribute access is the ability to read node properties.

Generic Access

Generic access is provided through the Element interface (a DOM subset):

Element myRect = document.getElementById("myRect");
String myRectWidth = myRect.getAttributeNS(svgNS, "width");

Typed access

UDOM offers a typed access to various element types and it is possible to access typed node specific properties.

RectElement myRect  = (RectElement)document.getElementById("myRect");
float myRectWidth = myRect.getWidth();

Notes:

A possible option is to provide typed access to attributes (as with the SVG DOM) but not generic string based access.
A possible alternative to specialized and typed method is to offer generic and typed method, such as getFloatAttributeNS(namespace, attributeName) / setFloatAttributeNS(namespace, attributeName, value).
Specialized and typed method (such as setX() on RectElement) modify the attribute's base value, not the attribute's presentation value. This means, among other things, that animations take precedence over script modifications.

Attribute Modification

Attribute modification is the ability to modify element properties.

Generic String Access

Attributes are modified through the Element interface (a DOM subset):

Element myRect = document.getElementById("myRect");
myRect.setAttributeNS(svgNS, "width", "450");

Specialized Access

UDOM offers typed modification of the properties through specialized node types.

RectElement myRect = (RectElement)document.getElementById("myRect");
myRect.setWidth(450f);

Important Note:

The UDOM proposal contains the SVGT Specific Interfaces which defines all the svg specific functionality. Key interfaces are: SVGElement for all the common attributes (such as the conditional attributes) GraphicsProperties which has all the painting properties (such as fill or stroke), TextProperties which implements the text and font properties (such as font-size or text-anchor) and the TransformableElement interface for elements which can be transformed.

Event Listener Registration and Removal

Event Listener Registration and Removal is the ability to add and remove new event listeners from a Document.
UDOM allows adding and removing EventListeners:

class MyEventListener implements EventListener {
    public void handleEvent(Event evt) {
        // Do whatever is needed here
    }
}
...
EventListener l = new MyEventListener();
Element myRect = document.getElementById("myRect");

// Listen to click events during the capture phase
myRect.addEventListener("click", l, true);

// Listen to mouseover events, during the buble phase
myRect.addEventListener("mouseover", l, false);
....

// Remove the click listener
myRect.removeEventListener("click", l, true);

Refer to the DOM Events Level 2 specification or the XML Events specification introduction for an explanation of the SVG event flow and the meaning of event targets, event current target, bubble and capture.

Animation

UDOM allows code to start or end animation elements.

AnimationElement animateColor 
    = (AnimationElement) document.getElementById("myAnimation");

animateColor.beginElement();

API Definitions

Interface Node

The Node interface is the interface for all XML tree model content. This interface is a subset of the Node interface defined in the DOM Core Level 2 specification.

Interface Document

The Document interface is the interface for an XML Document model. This interface is a subset of the Document interface defined in the DOM Core Level 2 specification. Note that the getFirstChild method returns the root of the document.

Interface Element

The Element interface represents an XML element in a Document. This interface is a subset of the Element interface defined in the DOM Core Level 2 specification. Note that in UDOM implementations which support events, Element implementations also implement the EventTarget interface. Refer to the DOM Level 2 Events for details.

Interface DOMException

The DOMException class defines a subset of the error codes defined in the DOM Core Level 2 specification.

Interface Event

Provides information about an event and its propagation. The interface allows listeners to stop the propagation. This interface is a subset of the Event interface defined in the DOM Level 2 Events specification. Please refer to that specification for details on what the different methods and members mean.

Interface EventListener

Interface used to receive Events from an EventTarget This interface is a subset of the EventListener interface defined in the DOM Level 2 Events specification. Please refer to that specification for details on what the different methods and members mean.

Interface EventTarget

The interface for DOM nodes which can receive and dispatch Events to EventListeners. This interface is a subset of the EventTarget interface defined in the DOM Level 2 Events specification. Please refer to that specification for details on what the different methods and members mean.

Interface SVGDocument

SVGDocument provides an API to access SVG specific features, such as setting the viewport size

Data Type	Description
Number	SVGT and SVGB support fixed point numbers, thus all numbers must be limited in range between -32,767.9999 to +32,767.9999 or the scientific notation equivalent.
Length	SVGT only supports user units (i.e., CSS units are not supported), with the one exception that the 'width' and 'height' attributes on the outermost 'svg' element can specify values in any of the following CSS units: in, cm, mm, pt, pc, and %. SVGB supports lengths in user coordinate space and in CSS units.
Coordinate	SVGT and SVGB support the coordinate data type, represented with a <length> value.
List of XXX	(where XXX represents a value of some type): SVGT and SVGB support the list specification.
Angle	SVGT only supports angles if specified with no CSS unit identifiers (which means all angles are in degrees). SVGB supports angles with CSS unit identifiers.
Color	SVGT and SVGB support <color> in the CSS2-compatible specification for a color in the sRGB color space, and system colors. Additionally, SVGB and SVGT support 16 original color keywords from XHTML, and do not support X11 colors. SVGB also allows optional support of ICC color profiles.
Paint	SVGB supports paint specification for fill and stroke operations, as well as linear and radial gradients. SVGT does not support the more general notion of paint specification and thus only supports solid color fills and strokes.
Percentage	SVGB supports percentages. SVGT does not support percentage values except for the 'width' and 'height' attributes on the outermost 'svg' element.
Transform List	SVGB and SVGT support transform lists.
URI	SVGB and SVGT support the URI datatype.
Frequency	SVGB and SVGT do not support frequency values.
Time	SVGB and SVGT support time values, with unit identifiers (ms, s).

DOCUMENT_NODE		The node is a `Document`
ELEMENT_NODE		The node is an `Element`

in Node newChild		The `Node` to insert.
in Node refChild		The `Node` before which `newChild` is inserted

in DOMString namespaceURI		The namespace uri for the newly created element.
in DOMString qName		The qualified name for the newly created element.

in DOMString namespaceURI		The namespace URI of the retrieved attribute.
in DOMString qName		The qualified name of the attribute to set on the element.

in DOMString namespaceURI		The namespace URI of the attribute to remove.
in DOMString qName		The qualified name of the attribute to remove.

in DOMString name		The name of the attribute to set on the element.
in DOMString value		The new attribute value.

INVALID_ACCESS_ERR		If a parameter or an operation is not supported by the underlying object.
INVALID_MODIFICATION_ERR		If an attempt is made to modify the type of the underlying object.
NOT_SUPPORTED_ERR		If the implementation does not support the requested type of object or operation.
WRONG_DOCUMENT_ERR		If a node is used in a different document than the one that created it (that doesn't support it)

AT_TARGET		The event is currently being evaluated at the target `EventTarget`.
BUBBLING_PHASE		The current event phase is the bubbling phase.
CAPTURING_PHASE		The current event phase is the capturing phase.

in DOMString type		The type of event to listen to.
in EventListener listener		Will be notified when an event of the desired type happens on this target or one of its descendant.
in boolean useCapture		If true, the listener will be called during the event flow capture phase. Otherwise, the listener will be called during the bubble phase. If the event's target is this target, then the listener will be called during the 'at target' phase of event flow.

in DOMString type		The type of event that was listened to.
in EventListener listener		The listener that was previously registered.
in boolean useCapture		If true, the listener was listening to events in the capture phase of event flow.

in SVGElement element		The element on which to perform the given test.
in SVGRect rect		The test rectangle. The values are in the initial coordinate system for the current 'svg' element.