Instead of using simple links, you can also set JavaScript links using FusionCharts i.e., you can invoke a JavaScript function present in the same page (in which the chart is present) when the end viewer clicks a data element on the chart. To attain this, all you need to do is place the name of JavaScript function instead of the link URL, as under:

<set name='USA' value='235' color='F23456' link="JavaScript:myJS('USA, 235');"/>

In the above code, myJS refers to a custom JavaScript function present in the HTML page that embeds this chart. You can also specify any number of parameters for this function. When you now click the data item (column, pie, bar etc.) for this particular data, myJs function would be invoked and 'USA, 235' would be passed to the function as the function parameter.

Let's quickly see a basic example of this. We'll create a folder DrillDown > Basic_JS for this example.

We'll create a simple 3D column chart indicating "Bank Branches Per Million Inhabitants" for South Asian countries. Each column when clicked, would pass its name and value to our custom JavaScript function myJS, which (for the sake of demonstration) would just write it out in an alert box. In realistic situations, you can use this data (passed from FusionCharts to JavaScript) to manipulate more data, visual interface or anything else.

We first create the XML data document for this example - Data.xml

As you can see above, for each data item, we've defined a JavaScript link, that points to the custom function myJS. To this function, we're passing the name and value of the data item.

The HTML page (Chart.html) looks as under: