new spline attr for the Line shape which enables splines

This commit is contained in:
Eric Rowell
2012-12-31 19:24:35 -08:00
parent b97a7ab1ba
commit f3a1e9a247
4 changed files with 150 additions and 10 deletions

View File

@@ -47,6 +47,87 @@ Test.Modules.LINE = {
line.setPoints([73, 160, 340, 23]);
test(line.getPoints()[0].x === 73, 'first point x should be 73');
},
'add curvy lines': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var line1 = new Kinetic.Line({
points: [{
x: 73,
y: 160
}, {
x: 340,
y: 23
}, {
x: 500,
y: 109
}, {
x: 300,
y: 109
}],
stroke: 'blue',
strokeWidth: 10,
lineCap: 'round',
lineJoin: 'round',
draggable: true,
spline: 1
});
var line2 = new Kinetic.Line({
points: [{
x: 73,
y: 160
}, {
x: 340,
y: 23
}, {
x: 500,
y: 109
}],
stroke: 'red',
strokeWidth: 10,
lineCap: 'round',
lineJoin: 'round',
draggable: true,
spline: 1
});
var line3 = new Kinetic.Line({
points: [{
x: 73,
y: 160
}, {
x: 340,
y: 23
}],
stroke: 'green',
strokeWidth: 10,
lineCap: 'round',
lineJoin: 'round',
draggable: true,
spline: 1
});
layer.add(line1);
layer.add(line2);
layer.add(line3);
stage.add(layer);
/*
line.transitionTo({
spline: 3,
duration: 3
});
*/
//console.log(layer.toDataURL());
warn(layer.toDataURL() === dataUrls['curvy lines'], 'problem with curvy lines');
},
'add dashed line': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
@@ -95,5 +176,5 @@ Test.Modules.LINE = {
test(line.getPoints().length === 4, 'line should have 4 points');
}
}
};