FusionCharts allows you to use rotated text for x-axis labels, y-axis name and data values. However, if you want to use rotated text when loading the charts in your Flash movie, you need to make sure that Verdana font face is embedded in your parent movie. Here, we'll show you how to do that.

Before that, let's see what happens if we do not embed the Verdana font face but rotate the labels.

We modify our MyFirstChart.fla example to have the following XML Code:

var strXML:String = "<chart showBorder='0' bgAlpha='0,0' palette='1' caption='Hourly Working Rate' numberPrefix='$' labelDisplay='ROTATE' slantLabels='1'>";

Here we've basically added the required attributes to rotate the x-axis labels. If you run this movie now, you'll see that the x-axis labels have disappeared from the chart as below.

This is because the rotated text could not find Verdana font face embedded in your Flash movie. Let's now see how to embed the font.

To embed the Verdana font face, create a new layer in your Flash movie in the main time line. Name it as "Embedded Font". In any keyframe of this layer, create a dynamic text box outside the stage area with following properties set:

As you can see in the image above:

• We've created the text box outside visible stage area, so that it's not displayed to the User.
• We've selected Verdana (non-bold) font and embedded (by clicking the Embed button) the following characters: Uppercase, Lowercase, Numerals & Punctuations. If you think you'll need to use more characters in rotated mode, just select them to be included in this list. If you include too many characters, the output size of your SWF proportionately increases.
• You need to include the font only once in your movie. After that, charts at any depth or in nested movie clips can access the embedded fonts.
• You need to necessarily include Verdana font only, as that's the font FusionCharts uses for rotated text.

When you now run your movie, you'll get the following output, as desired: