a port of the Processing Visualization Language


Processing.js Behavior Font support for the Canvas element varies across browsers. FireFox currently has the best support, but still uses a pre-defined set of fonts. (Documentation to follow soon.) Good alternatives to the browser's Canvas-font functions are available: such as the Glyph method. See also: Canvas Text, BurntToys Bauhaus.

Please use the following demos to learn how fonts can be rendered in Firefox with Processing.js: Letters, Words, width()

example pic
PFont metaBold;
// The font "Meta-Bold.ttf" must be located in the
// current sketch's "data" directory to load successfully
metaBold = loadFont("Meta-Bold.ttf");
String lines = "screen";
text(lines, 3, 70);

Sets the way text draws to the screen. In the default configuration (the MODEL mode), it's possible to rotate, scale, and place letters in two and three dimensional space.

Changing to SCREEN mode draws letters directly to the front of the window and greatly increases rendering quality and speed when used with the P2D and P3D renderers. textMode(SCREEN) with OPENGL and JAVA2D (the default) renderers will generally be slower, though pixel accurate with P2D and P3D. With textMode(SCREEN), the letters draw at the actual size of the font (in pixels) and therefore calls to textSize() will not affect the size of the letters. To create a font at the size you desire, use the "Create font..." option in the Tools menu, or use the createFont() function. When using textMode(SCREEN), any z-coordinate passed to a text() command will be ignored, because your computer screen is...flat!

The SHAPE mode draws text using the the glyph outlines of individual characters rather than as textures. This mode is only only supported with the PDF and OPENGL renderer settings. With the PDF renderer, you must call textMode(SHAPE) before any other drawing occurs. If the outlines are not available, then textMode(SHAPE) will be ignored and textMode(MODEL) will be used instead.

The textMode(SHAPE) option in OPENGL mode can be combined with beginRaw() to write vector-accurate text to 2D and 3D output files, for instance DXF or PDF. textMode(SHAPE) is not currently optimized for OPENGL, so if recording shape data, use textMode(MODEL) until you're ready to capture the geometry with beginRaw().

Returns None
Usage Web & Application
Related loadFont()

This reference is licensed under the CC BY-NC-SA 2.0 license:

Creative Commons License
Fork me on GitHub