svg element | SVGSVGElement object

Defines an SVG document or document fragement.

Scalable Vector Graphics: Document Structure, Section 5.11.2

DOM Information

Inheritance Hierarchy

 Node
  Element
   SVGElement
     SVGSVGElement

Members

The SVGSVGElement object has these types of members:

Events

The SVGSVGElement object has these events.

EventDescription
click

Fires when the user clicks the left mouse button on the object.

Note  Starting with IE11, this event fires a MSPointerEvent object instead of MouseEvent. You can use the MouseEvent.pointerType property to determine the type of contact that the click originated from (touch, mouse, or pen).

dblclick

Fires when the user double-clicks the object.

Note  Starting with IE11, this event fires a MSPointerEvent object instead of a MouseEvent. You can use the MouseEvent.pointerType property to determine the type of contact that the click originated from (touch, mouse, or pen).

focusin

Fires for an element just prior to setting focus on that element.

focusout

Fires for the current element with focus immediately after moving focus to another element.

load

Fires immediately after the client loads the object.

mousedown

Fires when the user clicks the object with either mouse button.

mousemove

Fires when the user moves the mouse over the object.

mouseout

Fires when the user moves the mouse pointer outside the boundaries of the object.

mouseover

Fires when the user moves the mouse pointer into the object.

mouseup

Fires when the user releases a mouse button while the mouse is over the object.

onabort

Occurs when page loading is stopped before an element is loaded completely.

onerror

Occurs when an element does not load properly or a script runs incorrectly.

onload

Occurs when the browser has fully parsed the element and all of its descendants.

onresize

Occurs when the document view is being resized.

onscroll

Occurs when a document view is being moved along the x-axis, y-axis, or both axes.

onunload

Occurs when a document is removed from a window or frame.

onzoom

Occurs when the document zoom level or currentScale property changes.

 

Methods

The SVGSVGElement object has these methods.

MethodDescription
animationsPaused

Gets a value that indicates whether this SVG document fragment is in a paused state.

checkEnclosure

Determines if the rendered content of the specified element is entirely contained within the specified rectangle.

checkIntersection

Determines if the rendered content of the specified element intersects the specified rectangle.

createEvent

Creates an event object to be used in conjunction with the dispatchEvent method.

createSVGAngle

Creates a new SVGAngle object that does not have units, that is set to 0 degrees, and that is not attached to any document.

createSVGLength

Creates a new SVGLength object that has a length of 0 user units.

createSVGMatrix

Creates a new SVGMatrix object that is set to the identity matrix and that is not attached to any document.

createSVGNumber

Creates a new SVGNumber object that has a value of zero and that is not attached to any document.

createSVGPoint

Creates a new SVGPoint object that is initialized to the point (0,0) in the user coordinate system and that is not attached to any document.

createSVGRect

Creates a new SVGRect object that has all values set to 0 user units and that is not attached to any document.

createSVGTransform

Creates a new SVGTransform object that is set to the identity matrix and that is not attached to any document.

createSVGTransformFromMatrix

Creates a matrix transform object whose values are given by the specified matrix.

deselectAll

Cancels the selection of any selected objects, including any selections of text strings and text boxes.

forceRedraw

Redraws all regions of the viewport that require updating.

getBBox

Gets the bounding box, in current user space, of the geometry of all contained graphics elements.

getComputedStyle

Returns the current computed value of the combined CSS properties for an element.

getCTM

Gets the transformation matrix that transforms from the current user units to the viewport coordinate system for the nearestViewportElement object.

getCurrentTime

Gets the current time, in seconds, relative to the start time for the current SVG document fragment.

getElementById

Gets the element that matches the specified ID from the SVG document or document fragment.

getEnclosureList

Gets the list of graphics elements whose rendered content is entirely contained within the specified rectangle.

getIntersectionList

Gets the list of graphics elements whose rendered content intersects the specified rectangle.

getScreenCTM

Gets the transformation matrix from the current user units to the screen coordinate system.

getTransformToElement

Gets the transformation matrix that transforms from the user coordinate system on the current element to the user coordinate system on the specified target element.

hasExtension

Determines if the specified extension is supported.

pauseAnimations

Pauses all currently running animations that are defined within the SVG document fragment that corresponds to this svg element.

setCurrentTime

Sets the new current time for this SVG document fragment.

suspendRedraw

Suspends redrawing a device for a specified duration.

unpauseAnimations

Resumes currently running animations that are defined within the SVG document fragment.

unsuspendRedraw

Cancels the specified suspension of redrawing operations.

unsuspendRedrawAll

Cancels all currently active suspensions of redrawing operations.

 

Properties

The SVGSVGElement object has these properties.

PropertyDescription

className

Gets the names of the classes that are assigned to this object.

clipPath

Sets or retrieves a reference to the SVG graphical object that will be used as the clipping path.

contentScriptType

Gets the default scripting language of the current document fragment.

contentStyleType

Gets the default style sheet language of the current document.

currentScale

Gets or sets the current scale factor, relative to the initial view (when this property is called from an outermost svg element.

currentTranslate

Gets or sets the current translation factor, relative to the initial view (when this property is called from an outermost svg element).

currentView

externalResourcesRequired

Gets a value that indicates whether referenced resources that are not in the current document are required to correctly render a given element.

farthestViewportElement

Gets a value that represents the farthest ancestor svg element.

focusable

Determines if an element can acquire keyboard focus (that is, receive keyboard events) and be a target for field-to-field navigation actions (such as when a user presses the Tab key).

height

Gets or sets the height of an element.

mask

Sets or retrieves a value that indicates a SVG mask.

nearestViewportElement

Gets a value that indicates which element established the current viewport.

ownerSVGElement

Gets the nearest ancestor svg element.

pixelUnitToMillimeterX

Gets or sets the size of a pixel unit along the x-axis of the viewport.

pixelUnitToMillimeterY

Gets or sets the size of a pixel unit along the y-axis of the viewport.

preserveAspectRatio

Gets an XML value that indicates whether to force uniform graphic scaling.

requiredExtensions

Gets a white space-delimited list of required language extensions.

requiredFeatures

Gets or sets a white space-delimited list of feature strings.

screenPixelToMillimeterX

Gets or sets the size of a screen pixel along the x-axis of the viewport.

screenPixelToMillimeterY

Gets or sets the size of a screen pixel along the y-axis of the viewport.

style

Gets a style object.

systemLanguage

Gets or sets a comma-separated list of language names.

useCurrentView

Gets or sets a value that indicates whether the current innermost SVG document fragment is the standard view (that is, based on attributes of the svg element such as viewBox) or a custom view (that is, a hyperlink into a particular view or other element.

viewBox

Gets a value that indicates how a graphic scales to fit a container element.

viewport

Gets or sets the current viewport.

viewportElement

Gets the element that established the current viewport.

width

Defines the width of an element.

x

Gets or sets the x-coordinate value.

xmlbase

Gets or sets the base attribute on the element.

xmllang

Gets or sets a value that specifies the language that is used in the contents and attribute values of an element.

xmlspace

Gets or sets a value that indicates whether white space is preserved in character data.

y

Gets or sets the y-coordinate value.

zoomAndPan

Gets the zoomAndPan attribute of an element.

 

Standards information

Remarks

Note  In addition to the attributes, properties, events, methods, and styles listed above, SVG elements also inherit core HTML attributes, properties, events, methods, and styles.

If an SVG document is likely to be referenced as a component of another document, you might want to include a viewBox attribute on the outermost svg element of the referenced document. This attribute provides a convenient way to design SVG documents to scale-to-fit into an arbitrary viewport.

svg elements can appear in the middle of SVG content. You can use these elements to embed SVG document fragments within other SVG document fragments. You can also use svg elements within the middle of SVG content to establish a new viewport.

In all cases, you must declare an SVG namespace so that all SVG elements are identified as belonging to the SVG namespace. Typically, you can declare an SVG namespace as follows:


<svg xmlns="http://www.w3.org/2000/svg" ... >

 

 

Show:
© 2014 Microsoft