canvas - npm Package Compare versions

Comparing version 0.5.4 to 0.6.0

History.md


		0.6.0 / 2011-06-04
		==================

		* Added `Image#src=Buffer` support. Closes #91
		* Added `devDependencies`
		* Added `source-atop` test
		* Added _image-src.js_ example
		* Removed `V8::AdjustAmountOfExternalAllocatedMemory()` call from `toBuffer()`
		* Fixed v8 memory hint when resizing canvas [atomizer]

		0.5.4 / 2011-04-20
		@@ -3,0 +13,0 @@ ==================

lib/canvas.js

		@@ -31,3 +31,3 @@

		exports.version = '0.5.4';
		exports.version = '0.6.0';

		@@ -34,0 +34,0 @@ /**

package.json

		{ "name": "canvas"
		, "description": "Canvas graphics API backed by Cairo"
		, "version": "0.5.4"
		, "version": "0.6.0"
		, "author": "TJ Holowaychuk <tj@learnboost.com>"
		@@ -10,4 +10,9 @@ , "keywords": ["canvas", "graphic", "graphics", "pixman", "cairo"]
		}
		, "devDependencies": {
		"express": "2.3.7"
		, "expresso": "0.7.6"
		, "jade": "0.11.0"
		}
		, "engines": { "node": "0.4.x" }
		, "main": "./lib/canvas.js"
		}

120

Readme.md

		@@ -1,2 +0,1 @@

		# node-canvas
		@@ -22,41 +21,66 @@

		var Canvas = require('canvas')
		, canvas = new Canvas(200,200)
		, ctx = canvas.getContext('2d');


		ctx.font = '30px Impact';
		ctx.rotate(.1);
		ctx.fillText("Awesome!", 50, 100);

		var te = ctx.measureText('Awesome!');
		ctx.strokeStyle = 'rgba(0,0,0,0.5)';
		ctx.beginPath();
		ctx.lineTo(50, 102);
		ctx.lineTo(50 + te.width, 102);
		ctx.stroke();

		console.log('<img src="' + canvas.toDataURL() + '" />');
		```javascript
		var Canvas = require('canvas')
		, canvas = new Canvas(200,200)
		, ctx = canvas.getContext('2d');

		ctx.font = '30px Impact';
		ctx.rotate(.1);
		ctx.fillText("Awesome!", 50, 100);

		var te = ctx.measureText('Awesome!');
		ctx.strokeStyle = 'rgba(0,0,0,0.5)';
		ctx.beginPath();
		ctx.lineTo(50, 102);
		ctx.lineTo(50 + te.width, 102);
		ctx.stroke();

		console.log('<img src="' + canvas.toDataURL() + '" />');
		```

		## Non-Standard API


		node-canvas extends the canvas API to provide interfacing with node, for example streaming PNG data, converting to a `Buffer` instance, etc. Among the interfacing API, in some cases the drawing API has been extended for SSJS image manipulation / creation usage, however keep in mind these additions may fail to render properly within browsers.

		### Image#src=Buffer

		node-canvas adds `Image#src=Buffer` support, allowing you to read images from disc, redis, etc and apply them via `ctx.drawImage()`. Below we draw scaled down squid png by reading it from the disk with node's I/O.

		```javascript
		fs.readFile(__dirname + '/images/squid.png', function(err){
		if (err) throw err;
		img = new Image;
		img.src = squid;
		ctx.drawImage(img, 0, 0, img.width / 4, img.height / 4);
		});
		```

		Below is an example of a canvas drawing it-self as the source several time:

		```javascript
		var img = new Image;
		img.src = canvas.toBuffer();
		ctx.drawImage(img, 0, 0, 50, 50);
		ctx.drawImage(img, 50, 0, 50, 50);
		ctx.drawImage(img, 100, 0, 50, 50);
		```

		### Canvas#createPNGStream()

		To create a `PNGStream` simple call `canvas.createPNGStream()`, and the stream will start to emit _data_ events, finally emitting _end_ when finished. If an exception occurs the _error_ event is emitted.

		var fs = require('fs')
		, out = fs.createWriteStream(__dirname + '/text.png')
		, stream = canvas.createPNGStream();

		stream.on('data', function(chunk){
		out.write(chunk);
		});

		stream.on('end', function(){
		console.log('saved png');
		});
		```javascript
		var fs = require('fs')
		, out = fs.createWriteStream(__dirname + '/text.png')
		, stream = canvas.createPNGStream();

		stream.on('data', function(chunk){
		out.write(chunk);
		});

		stream.on('end', function(){
		console.log('saved png');
		});
		```

		Currently _only_ sync streaming is supported, however we plan on supporting async streaming as well (of course :) ). Until then the `Canvas#toBuffer(callback)` alternative is async utilizing `eio_custom()`.
		@@ -66,29 +90,35 @@

		A call to `Canvas#toBuffer()` will return a node `Buffer` instance containing all of the PNG data.
		A call to `Canvas#toBuffer()` will return a node `Buffer` instance containing all of the PNG data.

		canvas.toBuffer();
		```javascript
		canvas.toBuffer();
		```

		### Canvas#toBuffer() async

		Optionally we may pass a callback function to `Canvas#toBuffer()`, and this process will be performed asynchronously, and will `callback(err, buf)`.
		Optionally we may pass a callback function to `Canvas#toBuffer()`, and this process will be performed asynchronously, and will `callback(err, buf)`.

		```javascript
		canvas.toBuffer(function(err, buf){

		canvas.toBuffer(function(err, buf){

		});
		});
		```

		### Canvas#toDataURL() async

		Optionally we may pass a callback function to `Canvas#toDataURL()`, and this process will be performed asynchronously, and will `callback(err, str)`.
		Optionally we may pass a callback function to `Canvas#toDataURL()`, and this process will be performed asynchronously, and will `callback(err, str)`.


		```javascript
		canvas.toDataURL(function(err, str){

		});
		```

		or specify the mime type:

		canvas.toDataURL('image/png', function(err, str){

		});
		```javascript
		canvas.toDataURL('image/png', function(err, str){

		});
		```

		@@ -105,3 +135,3 @@ ### CanvasRenderingContext2d#patternQuality

		In addition to those specified and commonly implemented by browsers, the following have been added:
		In addition to those specified and commonly implemented by browsers, the following have been added:

		@@ -128,5 +158,7 @@ - multiply
		For example:

		ctx.antialias = 'none';

		```javascript
		ctx.antialias = 'none';
		```

		## Benchmarks
		@@ -133,0 +165,0 @@

.DS_Store

.gitignore