ludo.svg.Paint

var canvas = new ludo.svg.Canvas({
		renderTo:'myDiv'
 	});

 	var paint = new ludo.svg.Paint({
		'stroke-width' : 5,
		'stroke-opacity' : .5,
		'stroke-color' : '#DEF'
	}, { className : 'MyClass' );
 	canvas.appendDef(paint); // Appended to <defs> node

 	// create node and set "class" to paint
 	// alternative methods:
 	// paint.applyTo(node); and
 	// node.addClass(paint.getClassName());
	var node = new ludo.svg.Node('rect', { id:'myId2', 'class' : paint});

 	canvas.append(node);

 	// Paint object for all <rect> and <circle> tags:

	var gradient = new ludo.svg.Gradient({
        id:'myGradient'
    });
    canvas.append(gradient);
    gradient.addStop('0%', '#0FF');
    gradient.addStop('100%', '#FFF', 0);
    // New paint object applied to all <rect> and <circle> tags.
 	var paint = new ludo.svg.Paint({
		'stroke-width' : 5,
		'fill' : gradient,
		'stroke-opacity' : .5,
		'stroke-color' : '#DEF'
	}, { selectors : 'rect, circle' );

Methods

---

applyTo(node)

Apply css to a SVG node. This is done by adding CSS class to the node

Parameters:

Name	Type	Description
node	canvas.Node

Source:

• svg/paint.js, line 134

---

getClassName() → {String}

Returns class name of Paint object

Source:

• svg/paint.js, line 144

Returns:

className

Type

String

---

getStyle(style) → {String|Number}

Return value of a css style

Parameters:

Name	Type	Description
style	String

Source:

• svg/paint.js, line 118

Returns:

value

Type

String | Number

---

setStyle(style, value)

Update a css style

Parameters:

Name	Type	Description
style	String
value	String | Number

Source:

• svg/paint.js, line 75

Example

var paint = new ludo.svg.Paint({
	 		css:{
	 			'stroke-opacity' : 0.5
	 		}
	 	});
	 	canvas.append(paint);
	 	paint.setStyle('stroke-opacity', .2);