Tweak examples/text.js to show use of extended measureText attributes, and add examples/pango-glyphs.js

examples/pango-glyphs.js

@@ -0,0 +1,30 @@
+
+/**
+ * Module dependencies.
+ */
+
+var Canvas = require('../lib/canvas')
+  , canvas = new Canvas(400, 100)
+  , ctx = canvas.getContext('2d')
+  , fs = require('fs');
+
+ctx.globalAlpha = 1;
+ctx.font = 'normal 16px Impact';
+
+ctx.textBaseline = 'top';
+
+// Note this demo depends node-canvas being installed with pango support,
+// and your system having installed fonts supporting the glyphs.
+
+ctx.fillStyle = '#000';
+ctx.fillText("English: Some text in Impact.", 10, 10);
+ctx.fillText("Japanese: 図書館の中では、静かにする。", 10, 30);
+ctx.fillText("Arabic: اللغة العربية هي أكثر اللغات تحدثا ضمن", 10, 50);
+ctx.fillText("Korean: 모타는사라미 못하는 사람이", 10, 70);
+
+var out = fs.createWriteStream(__dirname + '/pango-glyphs.png')
+  , stream = canvas.createPNGStream();
+
+stream.on('data', function(chunk){
+  out.write(chunk);
+});

examples/text.js

@@ -33,6 +33,15 @@ ctx.strokeText("Wahoo", 50, 100);
 ctx.fillStyle = '#000';
 ctx.fillText("Wahoo", 49, 99);
 
+var m = ctx.measureText("Wahoo");
+
+ctx.strokeStyle = '#f00';
+
+ctx.strokeRect(49 + m.actualBoundingBoxLeft,
+  99 - m.actualBoundingBoxAscent,
+  m.actualBoundingBoxRight - m.actualBoundingBoxLeft,
+  m.actualBoundingBoxAscent + m.actualBoundingBoxDescent);
+
 var out = fs.createWriteStream(__dirname + '/text.png')
   , stream = canvas.createPNGStream();