ChartDirector Mark Up Language (CDML) is a language for including formatting information in text by marking up the text with tags. It allows using different fonts and colors for different parts of the text, embedding images and symbols in the text, and customizing the text layout.

You can change the style of the text by using CDML tags. For example, the line:


will result in the following text rendered:


In general, all tags in CDML are enclosed by <* and *>. If you want to include <* in text without being interpreted as CDML tags, use <<* as the escape sequence.

The following table describes the supported font style attributes in CDML. Multiple font style attributes can be put in the same tag, separated by commas, or you may put each attribute in its own tag.

See Font Specification for details on various font attributes.


Note that unlike HTML tags, no double or single quotes are used in the tags. It is because CDML tags are often embedded as string literals in source code. The double or single quotes, if used, will conflict with the string literal quotes in the source code. Therefore in CDML, no quotes are necessary and they must not be used.

Also, unlike HTML tags, CDML uses the comma character as the delimiter between attributes. It is because certain attributes may contain embed spaces (such as the font file name). So space is not used as the delimiter and the comma character is used instead.

In CDML, a text string may contain multiple blocks. A block may contain multiple lines of text by separating them with new line characters ("\n") or with <*br*>. The latter is useful for programming languages that cannot represent new line characters easily.

For example, the line:


will result in the following:


The above example contains a line of text. The line contains two blocks with the characters " and " in between. Each block in turn contains two lines. The blocks are defined using <*block*> as the start tag and <*/*> as the end tag.

When a block ends, font styles will be restored to the state before entering the block.

CDML supports embedding images in text using the following syntax:


where my_image_file.png is the path name of the image file.

For example, the line:


will result in the following:


ChartDirector will automatically detect the image file format using the file extension, which must either png, jpg, jpeg, gif, wbmp or wmp (case insensitive).

Please refer to Path Specification on how ChartDirector interprets pathnames.

The <*img*> tag may optionally contain width and height attributes to specify its pixel width and height. In this case, ChartDirector will stretch or compress the image if necessary to the required width and height.

Apart from using image files, the <*img*> also supports built-in symbols. An example is:


The above will result in the following:


To use built-in symbols, instead of a filename, a '@' character should be used, followed by the shape id. The available built-in shapes are described in Shape Specification. Note that in CDML, the shape id does not have the trailing "Shape" word. For example, the "DiamondShape" in the Shape Specification should be represented as "@Diamond" in CDML. If the shape requires a parameter, it can be enclosed in parentheses, like "@Star(4)" for a four pointed star. Custom shapes are supported by using the @PolyShape(.....), with the NewShape constant entered directly as text. For example, the following is a donut shape consisting of two concentric circles:


The symbol width, height, fill color and edge color can be specified with the "width", "height", "color" and "edgeColor" attributes respectively.

The following table describes the supported attributes inside the <*img*> tag:

CDML supports nesting blocks, that is, a block can contain other sub-blocks. Attributes are supported in the <*block*> tag to control the alignment and orientation of the sub-blocks. The <*img=my_image_file.png*> is treated as a block for layout purposes.

For example, the line:


will result in the following text rendered:


The the above starts <*block,valign=absmiddle*> which specifies its content should align with each others in the vertical direction using the absolute middle alignment. The block contains an image, followed by a space characters, and then another block which has two lines of text.

The following table describes the supported attributes inside the <*block*> tag: