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

In this section we will show you how to create a complex chart - Multi-series Stacked 2D Line Dual Y Chart. Here we calculate the cost as Percentage of Revenue for three products A, B and C.

Let's examine the following data for a multi-series Stacked 2D Line Dual Y chart.
 
 Year
Product A
Product B
Product C
Cost as % of Revenue
2001 30 30 30 57
2002 26 26 26 68
2003 29 29 29 79
2004 31 31 31 73
2005 34 34 34 80

The chart that would be created using this data would look like the image shown below:

Here we need to create:

  • One primary dataset to stack up Revenue values for Product A(1) and Product A(2). The values would be scaled to the Primary Y Axis on the left.
  • Another primary dataset to show Revenue values for Product B. The values would be scaled to the Primary Y Axis on the left.
  • A lineset which would be automatically mapped to Secondary Y Axis.

Before you go further with this page, we recommend you to please see the previous page Creating First Chart as we start off from concepts explained in that page.

Let's go through the code that builds this chart:
 
<?php
           # Include FusionCharts PHP Class          
          include("../Class/FusionCharts_Gen.php");
           # Create Multiseries Stacked Column2D Line DY object using FusionCharts PHP Class 
         $FC = new FusionCharts("MSStackedColumn2DLineDY","450","350");
           # Set the relative path of the SWF file
         $FC->setSWFPath("../FusionCharts/");
           # Define chart attributes
         $strParam="caption=Annual Revenue;rotateValues=1;xAxisName=Year;
         PYAxisName=Revenue;SYAXisName=Cost as %25 of Revenue;numberPrefix=$;
         numberSuffix=M;sNumberSuffix=%25;SYAxisMinValue=0;SYAxisMaxValue=100;
         showValues=0;useroundedges=1;showSum=1";
           # Set chart attributes 
           $FC->setChartParams($strParam);
           # Add category names
           $FC->addCategory("2001");
           $FC->addCategory("2002");
           $FC->addCategory("2003");
           $FC->addCategory("2004");
           $FC->addCategory("2005");
           # Add Multi-series  Dataset
           $FC->createMSStDataset();
           # Add Multi-series dataset with in dataset
           $FC->addMSStSubDataset("Product A", "");
            # Add set data for plotting the chart
           $FC->addChartData("30");
           $FC->addChartData("26");
           $FC->addChartData("29");
           $FC->addChartData("31");
           $FC->addChartData("34");
           # Add Multi-series dataset with in dataset
           $FC->addMSStSubDataset("Product B", "");
           # Add set data for plotting the chart
           $FC->addChartData("30");
           $FC->addChartData("26");
           $FC->addChartData("29");
           $FC->addChartData("31");
           $FC->addChartData("34");
        
           # Add Multi-series  Dataset
           $FC->createMSStDataset();
           # Add Multi-series dataset with in dataset
           $FC->addMSStSubDataset("Product C", "");
           # Add set data for plotting the chart
           $FC->addChartData("30");
           $FC->addChartData("26");
           $FC->addChartData("29");
           $FC->addChartData("31");
           $FC->addChartData("34");

            # Add Multi-series lineset for showing lines
           $FC->addMSLineset("Cost as %25 of Revenue","lineThickness=4");
            # Add set data with in lineset
           $FC->addMSLinesetData("57");
           $FC->addMSLinesetData("68");
           $FC->addMSLinesetData("79");
           $FC->addMSLinesetData("73");
         $FC->addMSLinesetData("80");
      ?>
    <html>
     <head>
         <title>Multiseries Stacked Column2D Line DY Chart Using FusionCharts PHP Class</title>
         <script language='javascript' src='../FusionCharts/FusionCharts.js'></script>
     </head>
      <body>
        <?php
             # Render Chart        
             $FC->renderChart();       
        ?>   
      </body>
    </html>   

As you can see in the above code, we're doing the following:

  • We include FusionCharts_Gen.php.

  • We create an object for Multiseries Stacked Column2D Line DY chart and set relative file path to the SWF file.

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

  • We store chart attributes in $strParam variable and pass it to setChartParams() function. It sets chart attributes.

  • First, we add the category names separately using addCategory() function.

    $FC->addCategory("2001");
    $FC->addCategory("2002");
    $FC->addCategory("2003");
    $FC->addCategory("2004");
    $FC->addCategory("2005");

  • Let us now create the primary dataset and sub-datasets for Primary Y Axis.

    For this, we first create a multi-series primary dataset using createMSStDataset()for multi-series stacked column 2D line DY chart. Please note that all multi-series primary datasets would be mapped to Primary Y Axis on the left.

    $FC->createMSStDataset()

  • We add Multi-series sub-dataset within the primary dataset declared above. We use addMSStSubDataset() to do the task. It takes two parameters. First parameter takes the series name. The second parameter can take delimiter dataset attributes which we have kept blank in this example.

    $FC->addMSStSubDataset("Product A(1)", "")

  • We provide chart data specific to the above dataset. Remember to provide chart data just after the dataset is defined.

    $FC->addChartData("30","","");
    $FC->addChartData("26","","");
    $FC->addChartData("29","","");
    $FC->addChartData("31","","");
    $FC->addChartData("34","","");

    Please note that as we have 5 categories, we have entered 5 values for the dataset 'Product A'.

  • Likewise, we create another sub-dataset for product A(1) and provide the data values.

    $FC->addMSStSubDataset("Product B", "");
    $FC->addChartData("30","","");
    $FC->addChartData("26","","");
    $FC->addChartData("29","","");
    $FC->addChartData("31","","");
    $FC->addChartData("34","","");

  • We again create another primary dataset and add a sub-dataset for Product B and add respective data values.

    $FC->createMSStDataset();

     $FC->addMSStSubDataset("Product B", "");

    $FC->addChartData("30","","");
    $FC->addChartData("26","","");
    $FC->addChartData("29","","");
    $FC->addChartData("31","","");
    $FC->addChartData("34","","");

  • Now, we create a lineset. All linesets would be automatically mapped to Secondary Y Axis. You can create any number of linesets using this process.

    $FC->addMSLineset("Cost as % of Revenue","lineThickness=4");

  • Next, we add data to the lineset using addMSLinesetData().

    $FC->addMSLinesetData("57","","");
    $FC->addMSLinesetData("68","","");
    $FC->addMSLinesetData("79","","");
    $FC->addMSLinesetData("73","","");
    $FC->addMSLinesetData("80","","");

  • We add FusionCharts.js.

  • Finally, we 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.

And the Multi-series Stacked 2D Line Dual Y chart is ready!