lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-09-18 09:50:05 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

decided to make an actual Spline shape. Will create a Blob shape soon, which will be an enclosed spline

Browse Source
This commit is contained in:
Eric Rowell
2012-12-31 20:30:00 -08:00
parent f3a1e9a247
commit 176e805e58
5 changed files with 210 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
tests/js/unit/shapes/lineTests.js
View File

@@ -47,87 +47,6 @@ 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,

83
tests/js/unit/shapes/splineTests.js Normal file
View File

@@ -0,0 +1,83 @@
Test.Modules.SPLINE = {
'add splines': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var line1 = new Kinetic.Spline({
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,
tension: 1
});
var line2 = new Kinetic.Spline({
points: [{
x: 73,
y: 160
}, {
x: 340,
y: 23
}, {
x: 500,
y: 109
}],
stroke: 'red',
strokeWidth: 10,
lineCap: 'round',
lineJoin: 'round',
draggable: true,
tension: 1
});
var line3 = new Kinetic.Spline({
points: [{
x: 73,
y: 160
}, {
x: 340,
y: 23
}],
stroke: 'green',
strokeWidth: 10,
lineCap: 'round',
lineJoin: 'round',
draggable: true,
tension: 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');
}
};