Configuring Charts and Communication Methods

4. Configuring Charts and Communication Methods

4.1. Setting flashVars

In rMateChart, the flashVars variable is the standard variable to set the data and layout. This variable is passed as a parameter when you create charts.

To set the flashVars variable, you have to follow the rules as below.

• flashVars is the string type.
• To set more than two elements you can use “&” as a delimiter between each element. For example, to set the URL of the XML files for the layout and data in the flashVars variable you can define as the following.

var layoutURL = encodeURIComponent("./Column_3D_Layout.xml"); var flashVars = "layoutURL="+layoutURL;
var dataURL =encodeURIComponent("./singleData.xml"); flashVars += "&dataURL="+dataURL;

The following table shows the attributes which can be used in the flashVars variable.

Attribute	Value	Description
layoutURL	URL	Specifies the URL of a ayout file
dataURL	URL	Specifies the URL of a data file
rMateOnLoadCallFunction	Javascript function name	This function is called by rMateChart once the synchronization is completed between rMateChart and scripts (invoked only once)
displayCompleteCallFunction	Javascript function name	This function is called by rMateChart once the drawing charts is completed (invoked only once)
chartImageDpi	Number (default:72)	Sets DPI of the png image when saving charts as an image file.
debugMode	Boolean (default:false)	Whether or not the debug mode is used. If set to true, Chart Log (a menu item) will be activated when you click the right mouse button.
useSideBar  (Note : SideBar is a blue button on the upper right of charts) see “7.1.Using the Sidebar” chapter	Boolean (default:false)	Whether or not SideBar (a menu item) is used. If the value is set to true, rMateChart will load ChartSideBar.swf and display SideBar (a menu item) on charts.
useDataEditor (Note : DataEditor is a grid on the bottom of charts) see “5.4.3.Using the Data-Editor” chapter	Boolean (default:false)	Whether or not Data Editor is used. If the value is set to true, rMateChart will load ChartDataEditor.swf and display it on the bottom of charts.
saveImage	Boolean (default:true)	Whether or not ‘Save as image’ is added. (A menu item in the context menu that appears when mouse right-click)
addCrossHairToSide	Boolean (default:false)	Whether or not ‘Show the cross’ is added (A menu item in the SideBar menu)
addEditorToSide	Boolean (default:false)	Whether or not ‘Show the Data Editor’ is added (A menu item in the SideBar menu)
addZoomToSide	Boolean (default:false)	Whether or not ‘Zoom In/Out’ is added (A menu item in the SideBar menu)
addDrawingToSide	Boolean (default:true)	Whether or not ‘Drawing Tools’ is added (A menu item in the SideBar menu)
addSaveAsImgToSide	Boolean (default:true)	Whether or not ‘Save as image’ is added (A menu item in the SideBar menu)
addPrintToSide	Boolean (default:true)	Whether or not ‘Print’ is added (A menu item in the SideBar menu)
fontURL	URL	URL for external fonts.

<Table 2: The attribute of ‘flashvars’ variable>

• The difference between rMateOnLoadCallFunction and displayCompleteCallFunction

rMateOnLoadCallFunction is called only once when the synchronization is completed between rMateChart and script files (html, jsp, php, asp, etc). It means that rMateChart is ready to draw charts. This function is mainly used to transmit the data and layout to rMateChart.

displayCompleteCallFunction is called only once when the drawing charts on the web browser is completed. This function is useful if you want to do some tasks after the drawing charts is finished.

• Example of the flashVars variable

var rMateOnLoadCallFunction = "rMateChartOnLoad";
flashVars += "&rMateOnLoadCallFunction="+rMateOnLoadCallFunction;
function rMateChartOnLoad()
{
    ...
    ...
}

After creating the flashVars variable like the above example, you must add this variable as a parameter in the rMateChartCreate function.

rMateChartCreate("chart1","rMateChart",flashVars, 500, 500, "#FFFFFF");

4.2. Predefined Functions to Access Charts

For user’s convinience, rMateChart has made the following predefined functions.

1. setDataURL(value) : Transmits the URL of data files to charts.
2. setLayoutURL (value): Transmits the URL of layout files to charts.
3. setData (value): Transmits array formatted data or XML formatted data to charts.
4. setLayout (value): Transmits string formatted layouts to charts.
5. printChart (): Starts printing charts.
6. showDataEditor():Displays DataEditor at the bottom of charts.
7. saveAsImage (): Opens a new window to save as an image on your PC. (Same as ‘Save the chart image’ item in the context menu that appears when mouse right-click)
8. getSnapshot(): Gets snapshot. The image of charts is encoded in base64.
9. setSlideDataSet (value): Sets a set of data used in slide charts.
10. setSlideLayoutSet (value): Sets a set of layouts used in slide charts.
11. legendAllCheck(value): When you set the option as useVisibleCheck=’true’ in <Legend> node of the layout you can control the checkbox of legends to “select All”(true) or “All Releases”(false).

By using the above predefined functions you can transmit the data and layout to rMateChart with 6 different ways. The following table shows the 6 different ways.

No	Layout	Data	Function
1	path of XML	path of XML	setLayoutURL(path), setDataURL(path)
2	path of XML	Array format	setLayoutURL(path), setData(Array )
3	path of XML	String of XML	setLayoutURL(path), setData(string )
4	String of XML	path of XML	setLayout(string), setDataURL(path)
5	String of XML	Array format	setLayout(string), setData(Array)
6	String of XML	String of XML	setLayout(string), setData(string)

<Table 3: The Six Methods to Transmit the Data and Layout to rMateChart>

By using the above predefined functions, you can also dynamically change the layout and data of charts. Please refert to “8.19. Changing Layouts and Data Dynamically” for further information.

Click here for detail information & Demos