mirror of
https://github.com/konvajs/konva.git
synced 2025-11-18 09:07:30 +08:00
first pass at implementing filters. Still have a lot to work through.
This commit is contained in:
@@ -247,7 +247,6 @@ Test.prototype.tests = {
|
||||
clientY: 101
|
||||
});
|
||||
|
||||
console.log(layer.toDataURL())
|
||||
warn(layer.toDataURL() === urls[1], 'mid data url is incorrect');
|
||||
|
||||
// move mouse back out of circle
|
||||
|
||||
@@ -31,7 +31,7 @@ Test.prototype.tests = {
|
||||
for(var n = 0; n < 10000; n++) {
|
||||
context.putImageData(imageData, 7, 7);
|
||||
}
|
||||
endTimer('draw 10,000 images with image object from image data');
|
||||
endTimer('draw 10,000 images with putImageData');
|
||||
|
||||
},
|
||||
'DRAWING - draw rect vs image from data url': function(containerId) {
|
||||
@@ -61,15 +61,17 @@ Test.prototype.tests = {
|
||||
endTimer('create data url');
|
||||
|
||||
var imageObj = new Image();
|
||||
imageObj.onload = function() {
|
||||
layer.clear();
|
||||
|
||||
startTimer();
|
||||
for(var n = 0; n < 10000; n++) {
|
||||
context.drawImage(imageObj, 7, 7, 106, 106, 10, 10, 106, 106);
|
||||
}
|
||||
endTimer('draw 10,000 images with image object from data url');
|
||||
}
|
||||
imageObj.src = url;
|
||||
|
||||
layer.clear();
|
||||
|
||||
startTimer();
|
||||
for(var n = 0; n < 10000; n++) {
|
||||
context.drawImage(imageObj, 7, 7, 106, 106, 10, 10, 106, 106);
|
||||
}
|
||||
endTimer('draw 10,000 images with image object from data url');
|
||||
},
|
||||
'DRAWING - draw 1,000 stars': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
@@ -121,7 +123,7 @@ Test.prototype.tests = {
|
||||
layer.add(star);
|
||||
stage.add(layer);
|
||||
|
||||
console.log('call toImage')
|
||||
console.log('call toImage')
|
||||
star.toImage(function(img) {
|
||||
startTimer();
|
||||
for(var n = 0; n < 1000; n++) {
|
||||
|
||||
@@ -1991,6 +1991,39 @@ Test.prototype.tests = {
|
||||
};
|
||||
imageObj.src = '../darth-vader.jpg';
|
||||
},
|
||||
'SHAPE - filter image': function(containerId) {
|
||||
var imageObj = new Image();
|
||||
imageObj.onload = function() {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
width: 578,
|
||||
height: 200
|
||||
});
|
||||
var layer = new Kinetic.Layer({
|
||||
throttle: 999
|
||||
});
|
||||
darth = new Kinetic.Image({
|
||||
x: 10,
|
||||
y: 10,
|
||||
image: imageObj,
|
||||
draggable: true
|
||||
});
|
||||
|
||||
layer.add(darth);
|
||||
stage.add(layer);
|
||||
|
||||
test(darth.getWidth() === 438, 'image width should be 438');
|
||||
test(darth.getHeight() === 300, 'image height should be 300');
|
||||
|
||||
darth.applyFilter({
|
||||
filter: Kinetic.Filters.Grayscale,
|
||||
callback: function() {
|
||||
layer.draw();
|
||||
}
|
||||
});
|
||||
};
|
||||
imageObj.src = '../darth-vader.jpg';
|
||||
},
|
||||
'SHAPE - set image fill to color then image': function(containerId) {
|
||||
var imageObj = new Image();
|
||||
imageObj.onload = function() {
|
||||
|
||||
Reference in New Issue
Block a user