Radar & Polar Chart Data

Radar & Polar Chart Data

CSV

CSV data comes in the format:

axis name;first graph value;second graph value;nth graph value

For example:

Sales;15;16
Development;13;14
Marketing;10;8
Customer Support;14;19
Administration;13;7
Information technology;6;12

Each new line determines the new axis and values of your graphs, separated by a special character (the semicolon ';' is used by default - you can change it in the settings (<csv_separator>).

Remember, if you are using CSV data, you must tell the software to look for that format. This is done by setting <data_type>csv</data_type> in the settings file. If you load your data from a file, you will probably need to change file name of your data file too.

XML

Here is example of XML data for column chart:

<chart>
  <axes>
    <axis xid="0">Sales</axis>
      <axis xid="1">Development</axis>
      <axis xid="2">Marketing</axis>
      <axis xid="3">Customer Support</axis>
      <axis xid="4">Administration</axis>
      <axis xid="5">Information technology</axis> 		
  </axes>
  <graphs>
    <graph gid="1"> 
      <value xid="0">20</value>
      <value xid="1">15</value>
      <value xid="2">12</value>
      <value xid="3">18</value>
      <value xid="4">11</value>
      <value xid="5">19</value>
    </graph>
    <graph gid="2"> 
      <value xid="0">18</value>
      <value xid="1">13</value>
      <value xid="2">16</value>
      <value xid="3">15</value>
      <value xid="4">5</value>
      <value xid="5">13</value>
    </graph>               		
  </graphs>
</chart>

As you can see, the data comes in two parts: axes and graphs.

Axes define the number and names of your radar chart's axes. A chart must have at least three axes to display properly, and above that, you can have as many axes as you need. The axis name can be a number or a string, and can even contain some HTML formatting. The xid attribute is a unique identifier of the axis.

Graphs define the lines connecting the axes. Every graph has ID: gid="1". The GID is necessary if the settings for the graph are located in the settings file, and the GID in the data file must match the GID in the settings file. Each graph has values. The value tag has an XID attribute, which matches the xidof an axis. It is not necessary for every graph to have the same number of values as the number of graphs; the chart will handle missing data automatically.

XML data attributes

The XML data format allows you to apply some custom formatting for your data points. These settings are included within the <value> tag, for example:

<axes>
   .............
   <axis xid="1" color="00FF00" alpha="80">Sales</value>
   .............

This will make the axis be a semi-transparent green color.

Another example:

<graph gid="1">
   .............
   <value xid="1" bullet="square" bullet_size="3" url="http://www.bbc.com">19</value>
   .............
</graph>

This will put a small square bullet at the point where the graph intersects with the axis. Clicking on the bullet will open a link to the BBC website.

Below is the full list of available attributes:

<axis> can have the following attributes:

color	The color of the axis line. The value must be a hex color code.
alpha	The opacity of the axis line. The value is a number, in percent.
width	The width of the axis line. The value is a number, 0 means hairline.
fill_color	The color of the sector fill. The area between this axis and the next one (clockwise) will have this background color. The value must be a hex color code.
fill_alpha	The opacity of the sector fill. The value is a number, in percent.

<value> of a <graph> can have the following attributes:

url	The URL that will be opened when the viewer clicks on the bullet. You can also set the URL as a Javascript command. Because of security restrictions set by the Adobe Flash Player, the URL will not be clickable if you view the chart from a file on your hard drive. It needs to be uploaded to a Web server and then viewed through a browser for the URL to work correctly.
bullet	This attribute sets the shape of the bullet - if it is not provided, no bullet is shown. The following values are available: square, round, square_outlined, round_outlined, filename.swf. The filename.swf is the name of Adobe Flash file – you can use a custom Flash object as a bullet. The Flash file must be placed in the folder specified as "path" in the HTML code snippet. Outlined bullets use the plot area color for the outline.
bullet_color	The color of the bullet. This only affects predefined bullet shapes, not custom Flash bullets.
bullet_size	The size of the bullet. This only affects predefined bullet shapes, not custom Flash bullets.
description	The text that will be displayed in a balloon when the viewer rolls over the bullet with the mouse cursor.

Back to top