Skip to content

Instantly share code, notes, and snippets.

@danvine
Forked from bteitelb/gist:1423054
Created December 2, 2011 13:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danvine/1423241 to your computer and use it in GitHub Desktop.
Save danvine/1423241 to your computer and use it in GitHub Desktop.
node-canvas shadowBlur test
// Step 1:
// Retrieve test image:
// wget http://s3.amazonaws.com/tastrix/440/large_orig/shiso_trans.png
//
// Step 2:
// Then, run this through node.js
//
// Step 3:
// Inspect shade_test.png; the overlayed squares have drop shadow with Gaussian blur, the circle of leaves does not
var Canvas = require('canvas')
, Image = Canvas.Image
, canvas = new Canvas(2000, 2000)
, ctx = canvas.getContext('2d')
, fs = require('fs');
var carrots = fs.readFileSync(__dirname + '/shiso_trans.png');
img = new Image;
img.src = carrots;
ctx.fillStyle = '#FFF';
ctx.fillRect(0,0,1000,1000);
ctx.shadowColor = "#000";
ctx.shadowOffsetX = 3;
ctx.shadowOffsetY = 3;
ctx.shadowBlur = 15;
ctx.translate(300, 300);
ctx.save();
for (var i = 0; i < 8; i++) {
ctx.drawImage(img, 0, 0, 200, 300);
ctx.rotate(Math.PI / 4);
}
ctx.restore();
for (var i = 0; i < 3; i++) {
ctx.fillStyle = ['#F00', '#0F0', '#00F'][i];
ctx.translate(30, 30);
ctx.fillRect(300,300,310,310);
}
var out = fs.createWriteStream(__dirname + '/shade_test.png')
, stream = canvas.createPNGStream();
stream.on('data', function(chunk){
out.write(chunk);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment