sorted by: recent | see :
popular
Content Tagged with Dojo + svg
Be Quick Or Be Dead: browsergame spell caster powered by dojo gfx and SVG/VML rendering | labs @ involutive
SitePen Blog " Custom fonts with dojox.gfx
SitePen Blog " Custom fonts with dojox.gfx
Ajaxian " Custom fonts thanks to rendering SVG font definitions
Custom fonts thanks to rendering SVG font definitions
Tom Trenka has a fantastic post on custom fonts with dojo.gfx that shows the SVG font definition implementation.
Part one of the article deals with painful, practical issues around the licensing of fonts. Tom discusses the various technical options out there, and then gets to the solution:
In general, the issues surrounding font usage have to do with the ability for someone to visit a web site, grab a specific file, and be able to reuse it without paying for a legitimate copy within any of the most commonly used programs (such as Office). Because of this concern, both the EOT and sIFR techniques work–because the fonts are embedded in a form that is not reusable in a common way.
One approach: the SVG Font Specification
Similarly, the SVG Font specification allows for the same concept—by working with a specific font definition, especially one that can be customized for the specific usage, the spec avoids most of the prickly issues surrounding licensing.
SVG fonts are relatively simple in concept; within the <defs> element, you define the main specifications of a font, and then you include specific glyph definitions. Optionally, you can include character-specific kerning information (the space between letters); some fonts include this type of hinting, and the SVG specification supports it.
-
-
dojo.require("dojox.gfx");
-
dojo.require("dojox.gfx.VectorText");
-
-
var myfont = dojox.gfx.getVectorFont(someUri);
-
-
var s = dojox.gfx.createSurface(someNode, width, height);
-
var g = s.createGroup();
-
var phrase = myfont.draw(
-
g,
-
{ text: "The rain in Spain falls mainly on the plain.", align: "middle" },
-
{ size: "3em" },
-
"blue"
-
);
-
Very impressive. If you are a typography wonk, then you have probably watched Helvetica: The Movie: