Home

hersto:  The TextureTextLine PROTO

 

Rant to the author:

    

Check for a response

The TextureTextLine allows to display text that is rendered using textures instead of polygons. Thus, there are only two textured triangles necessary for each letter.

Internally the TextureTextLine node calculates an IndexedFaceSet that contains one rectangular face for each letter of the string. The texture coordinates of the faces point into a texture that contains a bitmap for each letter of the font.

In contrast to the standard VRML node Text, this text is faster to render and can be better readable when the text appears small, rotated or is viewed from the side if the texture uses large character cells, e.g. 64x32 pixel per character.

This version of the TextureTextLine node supports only fonts where each letter has the same width.

EXTERNPROTO TextureTextLine
[
    exposedField SFString text         # ""
    exposedField SFVec2f  size         # .7 1
to the TextureTextLine demo

    exposedField SFString allign       # "LEFT" or "CENTER" or "RIGHT"

    field        SFBool   singleSided  # TRUE

    # configuration parameters that describe the font texture:
    field    SFFloat   baseLine        # .2

    field    SFInt32   firstChar       # 32
    field    SFInt32   numCharsHorz    # 16
    field    SFInt32   numCharsVert    # 14

    field    SFInt32   imageWidth      # 512
    field    SFInt32   imageHeight     # 448

    eventOut SFBool    isLoaded
  ]
      "TextureTextLine.wrl#TextureTextLine"
    

 

 

To use this node, create a texture containing all letters you want to display. They should look like these: OCR-1.5.png, OCR-1.5-alpha.png. Create a Shape node and assign it the texture. The geometry field receives a TextureTextLine node.

 

Explanation of the fields:

exposedField SFString text         ""
exposedField SFVec2f  size         .7 1
exposedField SFString allign       "LEFT" or "CENTER" or "RIGHT"

The text field contains the string that should be displayed by the node. This text is displayed in the X-Y plane and is readable if viewed from a position with a positive Z value. The size of each letter is specified in the size field. The field allign specifies the allignment of the text: "LEFT" makes the origin (0, 0, 0) be on the left edge of the left most letter, "RIGHT" makes the origin be on the right edge of the right most letter, and "CENTER" makes it be in the center of the text line.

field        SFBool   singleSided  TRUE
Like with IndexedFaceSets the text is only visible if viewed from the front. If you set this flag to FALSE you can also see the text from behind it. But as a mirrored text.

field    SFFloat   baseLine        .2
This is the first parameter that describes the font in the texture. It defines the distance from the bottom line of a cell for a letter to the base line of the letter. The value is relative to the size of the zell. I.e. it is in the range 0..1 .

field    SFInt32   firstChar       32
field    SFInt32   numCharsHorz    16
field    SFInt32   numCharsVert    14
The texture is organized as a rectangular matrix of cells where each cell contains the bitmap of one letter. firstChar specifies the integer code of the character in the top left cell. numCharsHorz and numCharsVert specify the number of cells horizontally and vertically.

field    SFInt32   imageWidth      512
field    SFInt32   imageHeight     448
These two fields specify the size of the entire texture in pixels.

eventOut SFBool    isLoaded
The VRML specification requires a VRML Browser to dispose all events that a PROTO instance receives before it is loaded. IMHO this is a bad idea, because it makes initializing a node with a value that is not known at design time difficult. Therefore the isLoaded field emits TRUE when the PROTO has loaded.

 

The Demo:

This page displays some values about the current browser, time and frame rate. It demonstrates that text can be changed on the fly. Please rotate the text and change the distance to make it smaller to see how and when the text is readable.

While modulating the foreground color by the Material node works in this example, modulating this, the background color and the transparency may not work in all browsers/cases. :-(

__.-.__
end of document