SVGPathElement

In dit artikel

SVG path interface
1. Interface overview
Properties
Methods
Specifications
Browser compatibility
See also

Onze vrijwilligers hebben dit artikel nog niet naar het Nederlands vertaald. Doe mee en help de klus te klaren!

SVG path interface

The SVGPathElement interface corresponds to the <path> element.

Interface overview

Also implement	`SVGElement`, `SVGTests`, `SVGLangSpace`, `SVGExternalResourcesRequired`, `SVGStylable`, `SVGTransformable`, `SVGAnimatedPathData`
Methods	`float getTotalLength()` `SVGPoint getPointAtLength(in float distance)` `unsigned long getPathSegAtLength(in float distance)` `SVGPathSegClosePath createSVGPathSegClosePath()` `SVGPathSegMovetoAbs createSVGPathSegMovetoAbs(in float x, in float y)` `SVGPathSegMovetoRel createSVGPathSegMovetoRel(in float x, in float y)` `SVGPathSegLinetoAbs createSVGPathSegLinetoAbs(in float x, in float y)` `SVGPathSegLinetoRel createSVGPathSegLinetoRel(in float x, in float y)` `SVGPathSegCurvetoCubicAbs createSVGPathSegCurvetoCubicAbs(in float x, in float y, in float x1, in float y1, in float x2, in float y2)` `SVGPathSegCurvetoCubicRel createSVGPathSegCurvetoCubicRel(in float x, in float y, in float x1, in float y1, in float x2, in float y2)` `SVGPathSegCurvetoQuadraticAbs createSVGPathSegCurvetoQuadraticAbs(in float x, in float y, in float x1, in float y1)` `SVGPathSegCurvetoQuadraticRel createSVGPathSegCurvetoQuadraticRel(in float x, in float y, in float x1, in float y1)` `SVGPathSegArcAbs createSVGPathSegArcAbs(in float x, in float y, in float r1, in float r2, in float angle, in boolean largeArcFlag, in boolean sweepFlag)` `SVGPathSegArcRel createSVGPathSegArcRel(in float x, in float y, in float r1, in float r2, in float angle, in boolean largeArcFlag, in boolean sweepFlag)` `SVGPathSegLinetoHorizontalAbs createSVGPathSegLinetoHorizontalAbs(in float x)` `SVGPathSegLinetoHorizontalRel createSVGPathSegLinetoHorizontalRel(in float x)` `SVGPathSegLinetoVerticalAbs createSVGPathSegLinetoVerticalAbs(in float y)` `SVGPathSegLinetoVerticalRel createSVGPathSegLinetoVerticalRel(in float y)` `SVGPathSegCurvetoCubicSmoothAbs createSVGPathSegCurvetoCubicSmoothAbs(in float x, in float y, in float x2, in float y2)` `SVGPathSegCurvetoCubicSmoothRel createSVGPathSegCurvetoCubicSmoothRel(in float x, in float y, in float x2, in float y2)` `SVGPathSegCurvetoQuadraticSmoothAbs createSVGPathSegCurvetoQuadraticSmoothAbs(in float x, in float y)` `SVGPathSegCurvetoQuadraticSmoothRel createSVGPathSegCurvetoQuadraticSmoothRel(in float x, in float y);`
Properties	`SVGAnimatedNumber` `pathLength`
Normative document	SVG 1.1 (2nd Edition)

Properties

Name	Type	Description
`pathLength`	`SVGAnimatedNumber`	Corresponds to attribute `pathLength` on the given `<path>` element.

Methods

Name & Arguments	Return	Description
`getTotalLength``()`	float	Returns the computed value for the total length of the path using the browser's distance-along-a-path algorithm, as a distance in the current user coordinate system.
`getPointAtLength(in float distance)`	`SVGPoint`	Returns the (x,y) coordinate in user space which is distance units along the path, utilizing the browser's distance-along-a-path algorithm.
`getPathSegAtLength(in float distance)`	unsigned long	Returns the index into `pathSegList` which is `distance` units along the path, utilizing the user agent's distance-along-a-path algorithm.
`createSVGPathSegClosePath()`	`SVGPathSegClosePath`	Returns a stand-alone, parentless `SVGPathSegClosePath` object.
`createSVGPathSegMovetoAbs(in float x, in float y)`	`SVGPathSegMovetoAbs`	Returns a stand-alone, parentless `SVGPathSegMovetoAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment.
`createSVGPathSegMovetoRel(in float x, in float y)`	`SVGPathSegMovetoRel`	Returns a stand-alone, parentless `SVGPathSegMovetoRel` object. Parameters: `float x` The relative X coordinate for the end point of this path segment. `float y` The relative Y coordinate for the end point of this path segment.
`createSVGPathSegLinetoAbs(in float x, in float y)`	`SVGPathSegLinetoAbs`	Returns a stand-alone, parentless `SVGPathSegLinetoAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment.
`createSVGPathSegLinetoRel(in float x, in float y)`	`SVGPathSegLinetoRel`	Returns a stand-alone, parentless `SVGPathSegLinetoRel` object. Parameters: `float x` The relative X coordinate for the end point of this path segment. `float y` The relative Y coordinate for the end point of this path segment.
`createSVGPathSegCurvetoCubicAbs(in float x, in float y, in float x1, in float y1, in float x2, in float y2)`	`SVGPathSegCurvetoCubicAbs`	Returns a stand-alone, parentless `SVGPathSegCurvetoCubicAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment. `float x1` The absolute X coordinate for the first control point. `float y1` The absolute Y coordinate for the first control point. `float x2` The absolute X coordinate for the second control point. `float y2` The absolute Y coordinate for the second control point.
`createSVGPathSegCurvetoCubicRel(in float x, in float y, in float x1, in float y1, in float x2, in float y2)`	`SVGPathSegCurvetoCubicRel`	Returns a stand-alone, parentless `SVGPathSegCurvetoCubicRel` object. Parameters: `float x` The relative X coordinate for the end point of this path segment. `float y` The relative Y coordinate for the end point of this path segment. `float x1` The relative X coordinate for the first control point. `float y1` The relative Y coordinate for the first control point. `float x2` The relative X coordinate for the second control point. `float y2` The relative Y coordinate for the second control point.
`createSVGPathSegCurvetoQuadraticAbs(in float x, in float y, in float x1, in float y1)`	`SVGPathSegCurvetoQuadraticAbs`	Returns a stand-alone, parentless `SVGPathSegCurvetoQuadraticAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment. `float x1` The absolute X coordinate for the first control point. `float y1` The absolute Y coordinate for the first control point.
`createSVGPathSegCurvetoQuadraticRel(in float x, in float y, in float x1, in float y1)`	`SVGPathSegCurvetoQuadraticRel`	Returns a stand-alone, parentless `SVGPathSegCurvetoQuadraticRel` object. Parameters: `float x` The relative X coordinate for the end point of this path segment. `float y` The relative Y coordinate for the end point of this path segment. `float x1` The relative X coordinate for the first control point. `float y1` The relative Y coordinate for the first control point.
`createSVGPathSegArcAbs(in float x, in float y, in float r1, in float r2, in float angle, in boolean largeArcFlag, in boolean sweepFlag)`	`SVGPathSegArcAbs`	Returns a stand-alone, parentless `SVGPathSegArcAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment. `float r1` The x-axis radius for the ellipse. `float r2` The y-axis radius for the ellipse. `float angle` The rotation angle in degrees for the ellipse's x-axis relative to the x-axis of the user coordinate system. `boolean largeArcFlag` The value of the large-arc-flag parameter. `boolean sweepFlag` The value of the large-arc-flag parameter.
`createSVGPathSegArcRel(in float x, in float y, in float r1, in float r2, in float angle, in boolean largeArcFlag, in boolean sweepFlag)`	`SVGPathSegArcRel`	Returns a stand-alone, parentless `SVGPathSegArcRel` object. Parameters: `float x` The relative X coordinate for the end point of this path segment. `float y` The relative Y coordinate for the end point of this path segment. `float r1` The x-axis radius for the ellipse. `float r2` The y-axis radius for the ellipse. `float angle` The rotation angle in degrees for the ellipse's x-axis relative to the x-axis of the user coordinate system. `boolean largeArcFlag` The value of the large-arc-flag parameter. `boolean sweepFlag` The value of the large-arc-flag parameter.
`createSVGPathSegLinetoHorizontalAbs(in float x)`	`SVGPathSegLinetoHorizontalAbs`	Returns a stand-alone, parentless `SVGPathSegLinetoHorizontalAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment.
`createSVGPathSegLinetoHorizontalRel(in float x)`	`SVGPathSegLinetoHorizontalRel`	Returns a stand-alone, parentless `SVGPathSegLinetoHorizontalRel` object. Parameters: `float x` The relative X coordinate for the end point of this path segment.
`createSVGPathSegLinetoVerticalAbs(in float y)`	`SVGPathSegLinetoVerticalAbs`	Returns a stand-alone, parentless `SVGPathSegLinetoVerticalAbs` object. Parameters: `float y` The absolute Y coordinate for the end point of this path segment.
`createSVGPathSegLinetoVerticalRel(in float y)`	`SVGPathSegLinetoVerticalRel`	Returns a stand-alone, parentless `SVGPathSegLinetoVerticalRel` object. Parameters: `float y` The relative Y coordinate for the end point of this path segment.
`createSVGPathSegCurvetoCubicSmoothAbs(in float x, in float y, in float x2, in float y2)`	`SVGPathSegCurvetoCubicSmoothAbs`	Returns a stand-alone, parentless `SVGPathSegCurvetoCubicSmoothAbs` object. Parameters `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment. `float x2` The absolute X coordinate for the second control point. `float y2` The absolute Y coordinate for the second control point.
`createSVGPathSegCurvetoCubicSmoothRel(in float x, in float y, in float x2, in float y2)`	`SVGPathSegCurvetoCubicSmoothRel`	Returns a stand-alone, parentless `SVGPathSegCurvetoCubicSmoothRel` object. Parameters `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment. `float x2` The absolute X coordinate for the second control point. `float y2` The absolute Y coordinate for the second control point.
`createSVGPathSegCurvetoQuadraticSmoothAbs(in float x, in float y)`	`SVGPathSegCurvetoQuadraticSmoothAbs`	Returns a stand-alone, parentless `SVGPathSegCurvetoQuadraticSmoothAbs` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment.
`createSVGPathSegCurvetoQuadraticSmoothRel(in float x, in float y)`	`SVGPathSegCurvetoQuadraticSmoothRel`	Returns a stand-alone, parentless `SVGPathSegCurvetoQuadraticSmoothRel` object. Parameters: `float x` The absolute X coordinate for the end point of this path segment. `float y` The absolute Y coordinate for the end point of this path segment.

Specifications

Specification	Status	Comment
Scalable Vector Graphics (SVG) 1.1 (Second Edition)	Recommendation	Initial definition.
Scalable Vector Graphics (SVG) 2	Working Draft	Initial definition.

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	(Yes)[1]	?	?	?	?

Feature	Android	Android Webview	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile	Chrome for Android
Basic support	Not supported	(Yes)[1]	?	?	?	?	(Yes)[1]

[1] As required by the latest version of the spec, most of this interface was deprecated in Chrome 47. Removed in Chrome 48. The properties and methods still supported inlcude: getTotalLength(), getPointAtLength(), and getPathSegAtLength().

Documentlabels en -medewerkers

Labels:

Aan deze pagina hebben bijgedragen: szupie, jpmedley, fscholz, mehmetaergun, Naesten, kscarfone, Sheppy, Jeremie

Laatst bijgewerkt door: szupie, 19 jan. 2016 09:53:47

Zie ook