2017-10-11 16:17:54 +08:00
|
|
|
var fs = require('fs');
|
|
|
|
|
|
|
|
// relative path here
|
|
|
|
// but you will need just require('konva-node');
|
2019-06-08 04:05:27 +08:00
|
|
|
var Konva = require('./');
|
2014-03-04 19:40:06 +08:00
|
|
|
|
|
|
|
// Create stage. Container parameter is not required in NodeJS.
|
2015-01-27 15:07:51 +08:00
|
|
|
var stage = new Konva.Stage({
|
2017-07-31 17:34:10 +08:00
|
|
|
width: 100,
|
|
|
|
height: 100
|
2014-02-27 19:55:39 +08:00
|
|
|
});
|
|
|
|
|
2015-01-27 15:07:51 +08:00
|
|
|
var layer = new Konva.Layer();
|
2014-02-28 10:37:57 +08:00
|
|
|
stage.add(layer);
|
2015-01-27 15:07:51 +08:00
|
|
|
var rect = new Konva.Rect({
|
2017-07-31 17:34:10 +08:00
|
|
|
width: 100,
|
|
|
|
height: 100,
|
|
|
|
x: 50,
|
|
|
|
y: 50,
|
2017-10-11 16:17:54 +08:00
|
|
|
fill: 'white'
|
2014-02-27 19:55:39 +08:00
|
|
|
});
|
2015-01-27 15:07:51 +08:00
|
|
|
var text = new Konva.Text({
|
2017-07-31 17:34:10 +08:00
|
|
|
text: 'Generated inside node js',
|
|
|
|
x: 20,
|
|
|
|
y: 20,
|
|
|
|
fill: 'black'
|
2014-02-27 19:55:39 +08:00
|
|
|
});
|
|
|
|
layer.add(rect).add(text);
|
|
|
|
layer.draw();
|
2014-02-28 10:37:57 +08:00
|
|
|
stage.setSize({
|
2017-07-31 17:34:10 +08:00
|
|
|
width: 200,
|
|
|
|
height: 200
|
2014-02-28 10:37:57 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
// check tween works
|
2015-01-27 15:07:51 +08:00
|
|
|
var tween = new Konva.Tween({
|
2017-07-31 17:34:10 +08:00
|
|
|
node: rect,
|
|
|
|
duration: 1,
|
|
|
|
x: -50
|
2014-02-28 10:37:57 +08:00
|
|
|
});
|
|
|
|
tween.play();
|
|
|
|
|
2014-03-04 19:40:06 +08:00
|
|
|
// After tween we want to convert stage to dataURL
|
2017-07-31 17:34:10 +08:00
|
|
|
setTimeout(function() {
|
|
|
|
stage.toDataURL({
|
|
|
|
callback: function(data) {
|
|
|
|
// Then add result to stage
|
|
|
|
var img = new Konva.window.Image();
|
|
|
|
img.onload = function() {
|
|
|
|
var image = new Konva.Image({
|
|
|
|
image: img,
|
|
|
|
x: 10,
|
|
|
|
y: 50
|
|
|
|
});
|
|
|
|
layer.add(image);
|
|
|
|
layer.draw();
|
|
|
|
// save stage image as file
|
|
|
|
stage.toDataURL({
|
|
|
|
callback: function(data) {
|
|
|
|
var base64Data = data.replace(/^data:image\/png;base64,/, '');
|
|
|
|
fs.writeFile('./out.png', base64Data, 'base64', function(err) {
|
|
|
|
err && console.log(err);
|
|
|
|
console.log('See out.png');
|
|
|
|
});
|
2019-07-11 05:59:39 +08:00
|
|
|
// now try to create image from url
|
|
|
|
Konva.Image.fromURL(data, () => {
|
|
|
|
// shoul'd throw
|
|
|
|
});
|
2017-07-31 17:34:10 +08:00
|
|
|
}
|
|
|
|
});
|
|
|
|
};
|
|
|
|
img.src = data;
|
|
|
|
}
|
|
|
|
});
|
2016-05-06 15:31:35 +08:00
|
|
|
}, 1050);
|