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() } } // 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' }) } })