FusionCharts PHP Class API > Creating Combination Chart

Combination chart has two Y-axes. The Y-axis on the left hand side is called Primary Y-Axis and that on the right hand side is called Secondary Y-Axis. Combination charts are used when we intend to compare two different types of data on the same chart, e.g., if we want to plot Weekly Sales Revenue of two consecutive months and total units sold on the same chart, we have to use a Combination Chart. See the image below and note that Y-axes are representing different data units.

 
Before you go further with this page, we recommend you to please see the previous pages "Creating First Chart " & "Creating Multi-series chart" as we start off from concepts explained in that page.
 

Here is the code that builds up this Combination chart:

<?php

   # Include FusionCharts PHP Class
   include('../Class/FusionCharts_Gen.php');

   # Create Column 3D + Line Dual Y-Axis Combination Chart
   $FC = new FusionCharts("MSColumn3DLineDY","350","300");

   # Set the relative path of the swf file
   $FC->setSWFPath("../FusionCharts/");

   # Store chart attributes in a variable
   $strParam="caption=Weekly Sales;subcaption=Comparison;xAxisName=Week;pYAxisName=Revenue;sYAxisName=Total Quantity;decimalPrecision=0;";

   # Set chart attributes
   $FC->setChartParams($strParam);

   # Add category names
   $FC->addCategory("Week 1");
   $FC->addCategory("Week 2");
   $FC->addCategory("Week 3");
   $FC->addCategory("Week 4");

   # Add a new dataset with dataset parameters
   $FC->addDataset("This Month","numberPrefix=$;showValues=0");
   # Add chart data for the above dataset
   $FC->addChartData("40800");
   $FC->addChartData("31400");
   $FC->addChartData("26700");
   $FC->addChartData("54400");

   # Add aother dataset with dataset parameters
   $FC->addDataset("Previous Month","numberPrefix=$;showValues=0");
   # Add chart data for the second dataset
   $FC->addChartData("38300");
   $FC->addChartData("28400");
   $FC->addChartData("15700");
   $FC->addChartData("48100");

   # Add third dataset for the secondary axis
   $FC->addDataset("Total Quantity","parentYAxis=S");
   # Add secondary axix's data values
   $FC->addChartData("64");
   $FC->addChartData("70");
   $FC->addChartData("52");
   $FC->addChartData("81");

?>


<html>
   <head>
      <title>First Chart Using FusionCharts PHP Class</title>
      <script language='javascript' src='../FusionCharts/FusionCharts.js'></script>
   </head>
   <body>

      <?
         # Render Chart
         $FC->renderChart();
      ?>

   </body>
</html>
 

As you find in the above code, creating Combination charts is similar to creating Multi-Series charts. Here too, there are multiple datasets. Some datasets are specified for primary Y-Axis and some conform to the Secondary Y-Axis.  We need to specify which dataset belongs to which Y-Axis. Let's see how we did that in the following steps.

  • We include FusionCharts_Gen.php.

  • We create Multiseries Column 3D - Line Combination chart object and set relative path to swf file.

    $FC = new FusionCharts("MSColumn3DLineDY","350","300");
    $FC->setSWFPath("../FusionCharts/");

  • We store chart attributes in $strParam variable :

    $strParam="caption=Weekly Sales;subcaption=Comparison;xAxisName=Week; pYAxisName=Revenue;sYAxisName=Total Quantity;decimalPrecision=0;";

    Combination charts have 2 Y-Axes -Parent (p) and Secondary (s). So we have specified names for both of them.

  • We set these chart attributes calling setChartParams()

    $FC->setChartParams($strParam);

  • Next, like in Multi-series charts we add categories :

    $FC->addCategory("Week 1");
    $FC->addCategory("Week 2");
    $FC->addCategory("Week 3");
    $FC->addCategory("Week 4");

  • We add the first dataset 'This Month' for primary Y-Axis. If we do not specify the Y-Axis the dataset adheres to, the chart automatically sets it to primary Y-Axis. We also have set numberPrefix attribute for this dataset.

    $FC->addDataset("This Month","numberPrefix=$;showValues=0");
    $FC->addChartData("40800");
    $FC->addChartData("31400");
    $FC->addChartData("26700");
    $FC->addChartData("54400");

  • Again, we add another dataset 'Previous Month' for primary Y-Axis and set its attributes and data values.

    $FC->addDataset("Previous Month","numberPrefix=$;showValues=0");
    $FC->addChartData("38300");
    $FC->addChartData("28400");
    $FC->addChartData("15700");
    $FC->addChartData("48100");

  • Now, we add the third dataset for Secondary Y-axis and its data values. Here, we specify the Y-Axis passing the dataset attribute parentYAxis=S.

    $FC->addDataset("Total Quantity","parentYaxis=S");
    $FC->addChartData("64");
    $FC->addChartData("70");
    $FC->addChartData("52");
    $FC->addChartData("81");

  • Finally, we add FusionCharts.js and

  • render the chart :

    $FC->renderChart();
 
Please go through FusionCharts PHP Class API Reference section to know more about the functions used in the above code.
 
This code renders the Combination Chart that we needed.