You are viewing documentation for an older version. For current documentation - click here.
Getting chart reference

PowerCharts XT uses FusionCharts JavaScript Class that takes care of all the products of FusionCharts Suite XT including PowerCharts XT.

After a chart renders, you might want to do a lot of things with it, like, update data, get data from it, print it, export it as an image or a PDF, add event listener to it, change its setting or resize it. You may even want to clone it, remove it or obtain certain information, such as, chart type, id, width, height, version signature, etc.

You might want to know whether the chart has rendered, whether it is visible, or whether it is active. To get this information, you need to first get the reference to the chart object, that is, the chart handler. You can then perform the necessary tasks.

Here, in this page, we will learn how to get the reference to a chart object.

Code examples discussed in this section are present in Download Package > Code > JavaScript > Basics folder.

Get reference to the chart object

There are numerous ways of getting the reference to a chart object. On a broader level, you can get two types of references:

  1. the reference to the JavaScript Object that acts as a wrapper of the chart (that is, JavaScript variable)
  2. the reference to chart HTML Object which is embedded in the web page (that is, chart SWF Object)

Get JavaScript Object reference

To get the reference to the JavaScript object you can do one of the following:
1. Using JavaScript global variable name

If you have declared the JavaScript object in global-scope when instantiating the chart, you can use the JavaScript object's name as the reference.

Click here to see full code » 
<html>
  <head>
    <title>Get chart reference from variable in JS Global Scope</title>
    <script type="text/javascript" src="Charts/FusionCharts.js">
    </script>
  </head>
  <body>
    <div id="chartContainer">PowerCharts XT will load here!</div>
    <script type="text/javascript"><!--

      var myChart = new FusionCharts( "Charts/Spline.swf", 
      "myChartId", "400", "300", "0", "1" );
      myChart.setXMLUrl("Data.xml");
      myChart.render("chartContainer");

    // -->
    </script>
    <input type="button" onclick="myChart.print();" value="Print">

  </body>
</html>

See it live!

2. Using FusionCharts.items[] static Array

FusionCharts.items[] is an associative array that stores all the charts rendered in a page. The DOMId is represented by the key and the JavaScript chart object is the respective value. If you pass the DOMId of the chart to this array, you will get the reference to the JavaScript Object of the related chart.

var chart = FusionCharts.items["myChartId"];

See it live!

3. Using FusionCharts() function

You can also pass the chart's DOMId to FusionCharts(). Like FusionCharts.items[], FusionCharts() also returns the JavaScript Object of the chart.

var chart = FusionCharts("myChartId");

See it live!

It is recommended to use one of the above mentioned methods to get JavaScript Object reference of the charts.

The other methods, as explained below, of getting the reference of the chart HTML Object are not recommended as HTML Object provides limited interactive features.

4. Using legacy function: getChartFromId(DOMId)

The legacy function getChartFromId() still works. It is a global function (that is, it can be accessed from global/window scope) that returns the chart's Object (reference to chart SWF object). 

var chart = getChartFromId( DOMId );

See it live!

getChartFromId() has been deprecated

Get HTML Object reference

To get the reference to the chart HTML object you can use the following function:

1. FusionCharts.getObjectReference(DOMId)

getObjectReference() is static function of FusionCharts class. Like getChartFromId() it also returns the chart's HTML Object when chart's DOMId is passed to it as parameter. 

var chart = FusionCharts.getObjectReference( DOMId );

See it live!
Complete Reference to all the properties, functions and events of FusionCharts JavaScript Class is provided in API Reference section.