SVGTextContentElement

In This Article

The SVGTextContentElement interface is implemented by elements that support rendering child text content. It is inherited by various text-related interfaces, such as SVGTextElement, SVGTSpanElement, SVGTRefElement, SVGAltGlyphElement and SVGTextPathElement.

  <div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25  121,20  121,30  111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25  236,20  236,30  226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="303.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Element</text></a><polyline points="341,25  351,20  351,30  341,25" stroke="#D4DDE4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/SVGElement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="431" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">SVGElement</text></a><polyline points="481,25  491,20  491,30  481,25" stroke="#D4DDE4" fill="none"/><line x1="491" y1="25" x2="499" y2="25" stroke="#D4DDE4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#D4DDE4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/SVGGraphicsElement" target="_top"><rect x="301" y="65" width="180" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="391" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">SVGGraphicsElement</text></a><polyline points="301,89  291,84  291,94  301,89" stroke="#D4DDE4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/SVGTextContentElement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text  x="156" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">SVGTextContentElement</text></a></svg></div>

  a:hover text { fill: #0095DD; pointer-events: all;}

Constants

Constant	Value	Description
LENGTHADJUST_UNKNOWN	0	Some other value.
LENGTHADJUST_SPACING	1	The `spacing` keyword.
LENGTHADJUST_SPACINGANDGLYPHS	2	The `spacingAndGlyphs` keyword.

Properties

This interface also inherits properties from its parent, SVGGraphicsElement.

SVGTextContentElement.textLength Read only: An SVGAnimatedLength reflecting the textLength attribute of the given element.
SVGTextContentElement.lengthAdjust Read only: An SVGAnimatedEnumeration reflecting the lengthAdjust attribute of the given element. The numeric type values represent one of the constant values above.

Methods

This interface also inherits methods from its parent, SVGGraphicsElement.

SVGTextContentElement.getNumberOfChars(): Returns a long representing the total number of addressable characters available for rendering within the current element, regardless of whether they will be rendered.
SVGTextContentElement.getComputedTextLength(): Returns a float representing the computed length for the text within the element.
SVGTextContentElement.getSubStringLength(): Returns a float representing the computed length of the formatted text advance distance for a substring of text within the element.
SVGTextContentElement.getStartPositionOfChar(): Returns a DOMPoint representing the position of a typographic character after text layout has been performed.
Note: In SVG 1.1 this method returned an SVGPoint.
SVGTextContentElement.getEndPositionOfChar(): Returns a DOMPoint representing the trailing position of a typographic character after text layout has been performed.
Note: In SVG 1.1 this method returned an SVGPoint.
SVGTextContentElement.getExtentOfChar(): Returns a DOMRect representing the computed tight bounding box of the glyph cell that corresponds to a given typographic character.
SVGTextContentElement.getRotationOfChar(): Returns a float representing the rotation of typographic character.
SVGTextContentElement.getCharNumAtPosition(): Returns a long representing the character which caused a text glyph to be rendered at a given position in the coordinate system. Because the relationship between characters and glyphs is not one-to-one, only the first character of the relevant typographic character is returned
SVGTextContentElement.selectSubString(): Selects text within the element.

Specifications

Specification	Status	Comment
Scalable Vector Graphics (SVG) 2 The definition of 'SVGTextContentElement' in that specification.	Candidate Recommendation	Changed inheritance from `SVGElement` to `SVGGraphicsElement` and `getStartPositionOfChar()` and removed implementations of `SVGTests`, `SVGLangSpace`, `SVGExternalResourcesRequired`, `SVGStylable` interfaces and `getEndPositionOfChar()` to return a `DOMPoint` instead of an `SVGPoint`.
Scalable Vector Graphics (SVG) 1.1 (Second Edition) The definition of 'SVGTextContentElement' in that specification.	Recommendation	Initial definition

Feature	Chrome	Edge	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	(Yes)	20 (12.10240)	(Yes)	(Yes)	(Yes)	?

Feature	Android	Edge	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	?	?	?	?	?	?

Document Tags and Contributors

Tags:

Contributors to this page: Sebastianz

Last updated by: Sebastianz, Jan 7, 2017, 4:11:08 PM