Monthly Archives: February 2014

Overlaying SVG on top of canvas

http://jsfiddle.net/siddjain/wwLCD/ http://jsfiddle.net/siddjain/Hq63y/1/ Advertisements

Posted in Software | Leave a comment

Canvas and SVG Continued

Sample 1: measure text in canvas using context.measureText Sample 2: bounding box calculation for SVG using getBBox method. SVG also provides getComputedTextLength method to calculate text width Sample 3: breaking up hindi text into constituent characters in javascript Sample 4: … Continue reading

Posted in Software | Leave a comment

Performance Testing SVG & Canvas

SVG: Sample 1: Create 100 SVG labels, put them in a group, and apply a translate transform to the group in each frame Sample 2: Same as sample 1, except that no group is created, and a translate transform is … Continue reading

Posted in Software | Leave a comment

Drawing curved text in canvas and svg

Understanding Canvas Transformations http://jsfiddle.net/LJLpZ/1/ Test your understanding. WAP (write a program) to display circular text: http://jsfiddle.net/Keuy6/ http://jsfiddle.net/3cKN3/ Draw text along a curved path: http://jsfiddle.net/ymrdb/ Problems: 1. The characters are not equidistant. This is because the points on the polyline are … Continue reading

Posted in Software | Leave a comment