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

new toImage() method to support node caching

Browse Source
This commit is contained in:
Eric Rowell 2012-07-14 23:41:16 -07:00
parent 2629c1237c
commit 6dc7c685f0
5 changed files with 128 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dist/kinetic-core.js vendored
View File

@ -1319,6 +1319,12 @@ Kinetic.Node = Kinetic.Class.extend({
return bufferLayer.getCanvas().toDataURL();
}
},
/**
* to image
*/
toImage: function() {
return Kinetic.Type._getImage(this.toDataURL());
},
_setImageData: function(imageData) {
if(imageData && imageData.data) {
this.imageData = imageData;

4
dist/kinetic-core.min.js vendored
View File

File diff suppressed because one or more lines are too long

6
src/Node.js
View File

@ -853,6 +853,12 @@ Kinetic.Node = Kinetic.Class.extend({
return bufferLayer.getCanvas().toDataURL();
}
},
/**
* to image
*/
toImage: function() {
return Kinetic.Type._getImage(this.toDataURL());
},
_setImageData: function(imageData) {
if(imageData && imageData.data) {
this.imageData = imageData;

69
tests/js/performanceTests.js
View File

@ -70,5 +70,74 @@ Test.prototype.tests = {
context.drawImage(imageObj, 7, 7, 106, 106, 10, 10, 106, 106);
}
endTimer('draw 10,000 images with image object from data url');
},
'*ANIMATION - draw 1,000 stars': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
startTimer();
for(var n = 0; n < 1000; n++) {
var star = new Kinetic.Star({
innerRadius: 20,
outerRadius: 50,
fill: 'yellow',
stroke: 'black',
strokeWidth: 5,
numPoints: 5,
x: Math.random() * stage.getWidth(),
y: Math.random() * stage.getHeight()
});
layer.add(star);
}
stage.add(layer);
endTimer('draw 1,000 stars');
},
'*ANIMATION - draw 1,000 cached stars': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
startTimer();
var star = new Kinetic.Star({
innerRadius: 20,
outerRadius: 50,
fill: 'yellow',
stroke: 'black',
strokeWidth: 5,
numPoints: 5,
x: 70,
y: 70
});
layer.add(star);
stage.add(layer);
var img = star.toImage();
for(var n = 0; n < 1000; n++) {
var image = new Kinetic.Image({
image: img,
x: Math.random() * stage.getWidth(),
y: Math.random() * stage.getHeight(),
offset: 70
});
layer.add(image);
}
layer.draw();
endTimer('draw 1,000 stars');
}
};

45
tests/js/unitTests.js
View File

@ -2232,6 +2232,51 @@ Test.prototype.tests = {
};
imageObj.src = '../scorpion-sprite.png';
},
'*Node - shape caching': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var group = new Kinetic.Group();
var points = [{
x: 73,
y: 192
}, {
x: 73,
y: 160
}, {
x: 340,
y: 23
}, {
x: 500,
y: 109
}, {
x: 499,
y: 139
}, {
x: 342,
y: 93
}];
var poly = new Kinetic.Polygon({
points: points,
fill: 'green',
stroke: 'blue',
strokeWidth: 5
});
group.add(poly);
layer.add(group);
stage.add(layer);
test(Kinetic.Type._isElement(poly.toImage()), 'shape toImage() should be an image object');
test(Kinetic.Type._isElement(group.toImage()), 'group toImage() should be an image object');
test(Kinetic.Type._isElement(layer.toImage()), 'layer toImage() should be an image object');
test(Kinetic.Type._isElement(stage.toImage()), 'stage toImage() should be an image object');
},
'SHAPE - add polygon': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,