FusionCharts Knowledge Base


How do I use Multi-lingual characters in FusionCharts?

FusionCharts allows you to use multi-lingual (UTF-8) characters on the charts. Shown below is an example where we've used Arabic names on the chart:


You can use multi-lingual characters in all the charts in FusionCharts v3 suite.

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.

How to use multi-lingual characters?

To use multi-lingual characters on the chart, you necessarily need to use UTF-8 encoded XML. More importantly, the XML file/stream does require a BOM stamp to be present as the very first 3 Bytes of the file. Hence, one must remember the two basic thumb rules :

  • for dataURL method - the XML file/stream should be having the BOM stamp and
  • for dataXML method - the HTML/application file containing the XML as well as the chart SWF should have the BOM stamp.

What is BOM - Byte Order Mark. It is 'EF BB EF' - these 3 bytes in case of UTF-8 encoded files, the BOM being placed at the very beginning of the file. It is an indicator that the file is containing UTF-8 encoded strings.

WARNING : Do not rely on specifying the encoding setting i.e.,
<?xml version="1.0" encoding="UTF-8"?>
in the XML header region. This does not add the Byte Order Mark (BOM) to the XML file.

Please note that without the BOM stamp the chart would produce gibberish characters. Please compare the images below:


Standard (with BOM)


Gibberish (without BOM)


How to add BOM ?

1. In static XML

For the XML files which are generated one-time and remains static, you can manually insert a BOM mark. This method is applicable when data is retrieved from file using the dataURL method. 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:

  • Open the file in question in a text-editor that supports UTF-8 encoding with BOM stamp (Example – Windows Notepad).
  • Open the save menu and specify file name, file type, encoding and BOM mark (if the option is available).
  • Save the file.

The image below shows how this can be done in Windows Notepad.

The image below shows how this can be done in Dreamweaver for mac.


2. In dynamically generated XML using server-side script

In most of the cases you would NOT use a physical data file. Instead you'll have your own server side scripts virtually relay the XML data document to the chart. Thus this would come outside the scope of manual maintenance. Rather, you must write some code in the server side script to add the BOM stamp. The method is best practised when UTF-8 encoded strings are retrieved from databases and similar locations. The implementation can be done using either of the two methods:

  • Manually add BOM to the XML relayer script file - Just like adding BOM stamp to the static XML files you can also add the BOM stamp to the server side file which would be relaying the dynamically generated XML. This needs to be done when the script file is created for the first time before you start coding in it.
  • Write BOM using script - In most cases the XML relayer script file might be created with ANSI encoded format. In this case, one needs to add the BOM using script at the very beginning of the output stream. Moreover, when a server side script creates an XML file, it should add the BOM stamp as the very first 3 bytes of the file.

We list below techniques to implement BOM stamp using major server side technologies.

Using ASP.NET C#

Response.ContentType = "text/xml; characterset=utf-8" ;
Response.BinaryWrite( new byte[] { 0xEF, 0xBB, 0xBF
// Now write your XML data to output stream

Using ASP.NET VB

Response.ContentType = "text/xml"
Dim UTFHeader() As Byte = {&HEF, &HBB, &HBF}
Response.BinaryWrite(UTFHeader)
// Now write your XML data to output stream

Using PHP

header ( 'Content-type: text/xml' );
echo pack
( "C3" , 0xef, 0xbb, 0xbf );
// Now write your XML data to output stream

Using ASP

Response.AddHeader "Content-Type", "text/xml;charset=UTF-8"
Response.CodePage = 65001"
Response.BinaryWrite( chrb(239) )
Response.BinaryWrite( chrb(187) )
Response.BinaryWrite( chrb(191) )
// Now write your XML data to output stream

Using J2EE

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

Using ColdFusion

context = getPageContext();
response
= context.getResponse().getResponse();
out = response.getOutputStream();
out.write(239);
out.write(187);
out.write(191);
// Now write your XML data to output stream

Using ROR

utf8_arr = [0xEF,0xBB,0xBF]
utf8_str = utf8_arr.pack("c3")
# Now write your XML data to output stream

3. While using dataXML method

In many cases you might need to put the XML in the HTML/application file itself. We call this as dataXML method. Just like adding BOM stamp to a static XML files, in this case too you would need to save the file containing the chart SWF and XML with BOM stamp. This needs to be done when the script/HTML file is created for the first time before you start coding in it.



Related Articles

Attachments

No attachments were found.

Visitor Comments

Article Details

Last Updated
26th of September, 2011

Would you like to...

Print this page  Print this page

Email this page  Email this page

Post a comment  Post a comment

 Subscribe me

Subscribe me  Add to favorites

Remove Highlighting Remove Highlighting

Edit this Article

Quick Edit


User Opinions

100% thumbs up 0% thumbs down (1 vote)

How would you rate this answer?



Thank you for rating this answer.

Continue