An SVG Bar chart demonstrating PHP integration

This is a demonstration of integrating your PHP server-based code with RGraph. As demonstrated here you can use the json_encode() PHP function to convert your PHP arrays or objects into a string that you can print along with the rest of your page. You can then use the resulting JavaScript data structure to pass the information to RGraph.

This goes in the documents header:
<script src="RGraph.svg.common.core.js"></script>
<script src="RGraph.svg.bar.js"></script>
Put this where you want the chart to show up:
<div style="width: 550px; height: 300px" id="chart-container"></div>
This is the code that generates the chart:
<?php
    $data = array(
        array('value' => 6, 'label' => 'Jan', 'labelsAbove' => ''),
        array('value' => 3, 'label' => 'Feb', 'labelsAbove' => ''),
        array('value' => 8, 'label' => 'Mar', 'labelsAbove' => ''),
        array('value' => 9, 'label' => 'Apr', 'labelsAbove' => 'Highest'),
        array('value' => 4, 'label' => 'May', 'labelsAbove' => ''),
        array('value' => 5, 'label' => 'Jun', 'labelsAbove' => ''),
        array('value' => 6, 'label' => 'Jul', 'labelsAbove' => ''),
        array('value' => 4, 'label' => 'Aug', 'labelsAbove' => ''),
        array('value' => 3, 'label' => 'Sep', 'labelsAbove' => ''),
        array('value' => 1, 'label' => 'Oct', 'labelsAbove' => 'Lowest'),
        array('value' => 5, 'label' => 'Nov', 'labelsAbove' => ''),
        array('value' => 6, 'label' => 'Dec', 'labelsAbove' => ''),
    );
  
    $str = json_encode($data);
?>

<script>
    src = [{"value":6,"label":"Jan","labelsAbove":""},{"value":3,"label":"Feb","labelsAbove":""},{"value":8,"label":"Mar","labelsAbove":""},{"value":9,"label":"Apr","labelsAbove":"Highest"},{"value":4,"label":"May","labelsAbove":""},{"value":5,"label":"Jun","labelsAbove":""},{"value":6,"label":"Jul","labelsAbove":""},{"value":4,"label":"Aug","labelsAbove":""},{"value":3,"label":"Sep","labelsAbove":""},{"value":1,"label":"Oct","labelsAbove":"Lowest"},{"value":5,"label":"Nov","labelsAbove":""},{"value":6,"label":"Dec","labelsAbove":""}];
    
    data        = [];
    labels      = [];
    labelsAbove = [];

    // Extract the data from the array
    for (var i=0; i< src.length; ++i) {
        data.push(src[i].value);
        labels.push(src[i].label);
        labelsAbove.push(src[i].labelsAbove);
    }

    var bar = new RGraph.SVG.Bar({
        id: 'chart-container',
        data: data,
        options: {
            colors: ['#a00'],
            xaxisLabels: labels,
            labelsAbove: true,
            labelsAboveSize: 8,
            labelsAboveSpecific: labelsAbove,
            xaxis: false,
            yaxis: false,
            backgroundGridVlines: false,
            backgroundGridBorder: false
        }
    }).wave();
</script>