Skip to content

Commit 050af98

Browse files
author
wout
committed
added pointAt() method to SVG.Path
1 parent c51d352 commit 050af98

6 files changed

Lines changed: 68 additions & 42 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@
55
- automatic pattern creation by passing an image url or instance as `fill` attribute on elements
66
- added `loaded()` method to image tag
77
- fix in `animate('=').to()`
8+
- added `pointAt()` method to `SVG.Path`, wrapping the native `getPointAtLength()`
9+
- moved `length()` method to sugar module
810

911
# v1.0rc3 (03/02/2014)
1012

@@ -13,6 +15,7 @@
1315
- using `SVG.invent` to generate core shapes as well for leaner code
1416
- added second values for `animate('2s')`
1517
- fix for arcs in patharray `toString()` method
18+
- added `length()` mehtod to path, wrapping the native `getTotalLength()`
1619

1720
# v1.0rc2 (01/02/2014)
1821

‎dist/svg.js‎

Lines changed: 26 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/* svg.js 1.0.0-rc.4-2-g6d76750 - svg inventor regex default color array pointarray patharray number viewbox bbox rbox element parent container fx relative event defs group arrange mask clip gradient pattern doc shape use rect ellipse line poly path image text textpath nested hyperlink sugar set data memory loader - svgjs.com/license */
1+
/* svg.js 1.0.0-rc.4-3-gc51d352 - svg inventor regex default color array pointarray patharray number viewbox bbox rbox element parent container fx relative event defs group arrange mask clip gradient pattern doc shape use rect ellipse line poly path image text textpath nested hyperlink sugar set data memory loader - svgjs.com/license */
22
;(function() {
33

44
this.SVG = function(element) {
@@ -2979,10 +2979,7 @@
29792979
, height: function(height) {
29802980
return height == null ? this.bbox().height : this.size(this.bbox().width, height)
29812981
}
2982-
// Get path length
2983-
, length: function() {
2984-
return this.node.getTotalLength()
2985-
}
2982+
29862983
}
29872984

29882985
// Add parent method
@@ -3445,7 +3442,6 @@
34453442

34463443
})
34473444

3448-
//
34493445
SVG.extend(SVG.Rect, SVG.Ellipse, {
34503446
// Add x and y radius
34513447
radius: function(x, y) {
@@ -3454,23 +3450,32 @@
34543450

34553451
})
34563452

3453+
SVG.extend(SVG.Path, {
3454+
// Get path length
3455+
length: function() {
3456+
return this.node.getTotalLength()
3457+
}
3458+
// Get point at length
3459+
, pointAt: function(length) {
3460+
return this.node.getPointAtLength(length)
3461+
}
34573462

3458-
if (SVG.Text) {
3459-
SVG.extend(SVG.Text, SVG.FX, {
3460-
// Set font
3461-
font: function(o) {
3462-
for (var key in o)
3463-
key == 'anchor' ?
3464-
this.attr('text-anchor', o[key]) :
3465-
_styleAttr.indexOf(key) > -1 ?
3466-
this.attr('font-'+ key, o[key]) :
3467-
this.attr(key, o[key])
3468-
3469-
return this
3470-
}
3463+
})
3464+
3465+
SVG.extend(SVG.Text, SVG.FX, {
3466+
// Set font
3467+
font: function(o) {
3468+
for (var key in o)
3469+
key == 'anchor' ?
3470+
this.attr('text-anchor', o[key]) :
3471+
_styleAttr.indexOf(key) > -1 ?
3472+
this.attr('font-'+ key, o[key]) :
3473+
this.attr(key, o[key])
34713474

3472-
})
3473-
}
3475+
return this
3476+
}
3477+
3478+
})
34743479

34753480

34763481

‎dist/svg.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎spec/spec/path.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -159,6 +159,19 @@ describe('Path', function() {
159159
expect(path.node.getAttribute('d')).toBe('M 50 60 A 60 60 0 0 0 50 -60 H 100 V 100 L 20 30 C 10 20 30 40 50 60')
160160
})
161161
})
162+
163+
describe('length()', function() {
164+
it('gets the total length of the path', function() {
165+
expect(path.length()).toBe(path.node.getTotalLength())
166+
})
167+
})
168+
169+
describe('pointAt()', function() {
170+
it('gets a point at given length', function() {
171+
expect(path.pointAt(100)).toEqual(path.node.getPointAtLength(100))
172+
})
173+
})
174+
162175

163176
})
164177

‎src/path.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,10 +37,7 @@ SVG.Path = SVG.invent({
3737
, height: function(height) {
3838
return height == null ? this.bbox().height : this.size(this.bbox().width, height)
3939
}
40-
// Get path length
41-
, length: function() {
42-
return this.node.getTotalLength()
43-
}
40+
4441
}
4542

4643
// Add parent method

‎src/sugar.js‎

Lines changed: 24 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,6 @@ SVG.extend(SVG.Element, SVG.FX, {
7272

7373
})
7474

75-
//
7675
SVG.extend(SVG.Rect, SVG.Ellipse, {
7776
// Add x and y radius
7877
radius: function(x, y) {
@@ -81,21 +80,30 @@ SVG.extend(SVG.Rect, SVG.Ellipse, {
8180

8281
})
8382

83+
SVG.extend(SVG.Path, {
84+
// Get path length
85+
length: function() {
86+
return this.node.getTotalLength()
87+
}
88+
// Get point at length
89+
, pointAt: function(length) {
90+
return this.node.getPointAtLength(length)
91+
}
8492

85-
if (SVG.Text) {
86-
SVG.extend(SVG.Text, SVG.FX, {
87-
// Set font
88-
font: function(o) {
89-
for (var key in o)
90-
key == 'anchor' ?
91-
this.attr('text-anchor', o[key]) :
92-
_styleAttr.indexOf(key) > -1 ?
93-
this.attr('font-'+ key, o[key]) :
94-
this.attr(key, o[key])
95-
96-
return this
97-
}
93+
})
94+
95+
SVG.extend(SVG.Text, SVG.FX, {
96+
// Set font
97+
font: function(o) {
98+
for (var key in o)
99+
key == 'anchor' ?
100+
this.attr('text-anchor', o[key]) :
101+
_styleAttr.indexOf(key) > -1 ?
102+
this.attr('font-'+ key, o[key]) :
103+
this.attr(key, o[key])
98104

99-
})
100-
}
105+
return this
106+
}
107+
108+
})
101109

0 commit comments

Comments
 (0)