FusionCharts for Flex > Special Cases > Multilingual Characters in Charts

Multilingual Character-Sets

FusionCharts allows you to use multi-lingual (UTF-8) characters on the charts. For our purposes, we need to pass a UTF-8 encoded XML file to a chart which is a Flash component. Flash has no issues regarding UTF encoding, but DOES require a byte-order mark to be present in UTF-8 encoding. So, to display UTF-8 characters in your FusionCharts, you need to stamp the UTF-8 encoded XML file with a byte-order mark.
 

You can use multi-lingual characters in all the charts in FusionCharts v3 suite. However, any rotated text on chart cannot show non-English characters. That is, if you want to use multi-lingual characters, you'll need to show horizontal x-axis labels and y-axis name (using <chart rotateYAxisName='0' ..>).

FusionCharts supports only left-to-right languages as of now. It doesn't have native support for right-to-left languages like Hebrew. So, if you want to use Hebrew with FusionCharts, you'll have to programmatically change the text sequence and then provide the data to FusionCharts.

WARNING

Do not rely on specifying the encoding for your XML file in the XML header region as this does not add the Byte Order Mark.

<?xml version="1.0" encoding="UTF-8"?>

UTF-8 may be the default encoding for XML files, but the encoding needs to be specified when saving the file. Also, you have to make sure that the application which saves the file applies the BOM mark.

 

Otherwise, characters will be displayed as gibberish.

Standard Gibberish

Implementation

The Adobe Flex platform automatically handles data sources with Unicode characters. However, for external XML datasources, they must be encoded with a byte-order mark. The UTF-8 representation of the BOM is the byte sequence EF BB BF (Hex-Decimal Notation), which appears as the ISO-8850-1 characters  in most text-editors.  To apply byte-order mark to an XML file, we must consider the process of XML generation and apply the respective methods.

Implementation for Static Flex Data Sources

This method is applicable when inline static Flex data sources such as String, Array, XML or Model are used. The the Unicode characters can be directly typed using a multi-lingual interface. They can also be specified by the \u escape sequence and the appropriate UTF Hex-Code.


// Chart declared using Array data type

private var chartParams:ArrayCollection=new ArrayCollection([
{caption: "藤原とふショプ \u00A9"},
.....
]);

// A Japanese caption, followed by copyright sign

Implementation for Static XML Generation

For the XML files which are generated once and remains static, you can manually insert a BOM mark. This method is applicable when data is retrieved from file using the FCDataURL attribute. All you have to do is make sure the file containing the XML data contains a BOM mark or specify one if it is absent. In order to specify a BOM mark, follow these steps:
  1. Open the file in question in a text-editor that supports UTF-8 encoding with BOM stamp (Example – Windows Text Editor).
  2. Open the save menu and specify file name, file type, encoding and BOM mark (if the option is available).
  3. Save the file.

Implementation for Dynamic XML Generation

For the XML files which are generated by other applications and are outside the scope of manual maintenance, you must control the generation of XML to provide the BOM mark. This method is applicable when data is retrieved from a file using the FCDataURL attribute. The following solutions are provided for generating XML files on the server-side.

Implementation for ASP generated XML

Insert the following code block at the beginning of page generation before outputting any data.

Response.ContentType = "text/html"
Response.AddHeader "Content-Type", "text/html;charset=UTF-8"
Response.CodePage = 65001
Response.CharSet = "UTF-8"
Response.BinaryWrite(chrb(239))
Response.BinaryWrite(chrb(187))
Response.BinaryWrite(chrb(191))

Implementation for C# generated XML

Insert the following code block at the beginning of page generation before outputting any data.

Response.ContentType = "text/xml; characterset=utf-8";
Response.BinaryWrite(new byte[] { 0xEF, 0xBB, 0xBF });

Implementation for Cold Fusion Markup generated XML

Insert the following code block at the beginning of page generation before outputting any data.

context = getPageContext();
response = context.getResponse().getResponse();
out = response.getOutputStream();
out.write(239);
out.write(187);
out.write(191);

For outputting data, you must convert the string to UTF-8 format. Using the getBytes("UTF-8") method for strings.

Implementation for JSP generated XML

Insert the following code block at the beginning of page generation before outputting any data.

response.setContentType("text/xml; charset=UTF-8");
OutputStream outs = response.getOutputStream();
outs.write(new byte[]{(byte)0xEF, (byte)0xBB, (byte)0xBF});
outs.flush();

Implementation for PHP generated XML

Insert the following code block at the beginning of page generation before outputting any data.

header('Content-type: text/xml');
echo pack("C3",0xef,0xbb,0xbf);

Implementation for ASP.Net VB generated XML

Insert the following code block at the beginning of page generation before outputting any data

Response.ContentType = "text/xml"
Dim UTFHeader() As Byte = {&HEF, &HBB, &HBF}
Response.BinaryWrite(UTFHeader)

Implementation for Dynamic Flex Data Sources

For data sources which are dynamically generated by other applications, you do not need to specify the BOM mark. This is because; the data passed will be converted into a Flex data source and then be transferred to the FusionCharts object. In this process the data will be automatically formatted and no explicit declaration is necessary.