1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
|
SVG.Pattern = SVG.invent({
// Initialize node
create: 'pattern'
// Inherit from
, inherit: SVG.Container
// Add class methods
, extend: {
// Return the fill id
fill: function() {
return 'url(#' + this.id() + ')'
}
// Update pattern by rebuilding
, update: function(block) {
// remove content
this.clear()
// invoke passed block
if (typeof block == 'function')
block.call(this, this)
return this
}
// Alias string convertion to fill
, toString: function() {
return this.fill()
}
// custom attr to handle transform
, attr: function(a, b, c) {
if(a == 'transform') a = 'patternTransform'
return SVG.Container.prototype.attr.call(this, a, b, c)
}
}
// Add parent method
, construct: {
// Create pattern element in defs
pattern: function(width, height, block) {
return this.defs().pattern(width, height, block)
}
}
})
SVG.extend(SVG.Defs, {
// Define gradient
pattern: function(width, height, block) {
return this.put(new SVG.Pattern).update(block).attr({
x: 0
, y: 0
, width: width
, height: height
, patternUnits: 'userSpaceOnUse'
})
}
})
|