Hello Everyone,

I am trying to display a graph, but it is not working. I see that the variables is getting the correct value, so maybe the addSeries is not recognizing the variables. Can anyone help me? See the code below:

    <!DOCTYPE html>
        <html >
        <head>
        <?php
        //connect to database
        $con = mysql_connect("localhost", "test", "test") or die('Sorry, could not connect to database server');
        mysql_select_db("brazil", $con) or die('Sorry, could not connect to database');

        //total number of participants
        $query1 = "SELECT participantsExpected from ac where identity =4";
        //number of participants in neoadjuvant chemoterapy
        $query2 = "Select participantsEnrolled from ac where identity=4";
        //number of participants in surgery
        $query3 = "SELECT participantsExpected from ac where identity =2";
        //number of participants off study
        $query4 = "Select participantsEnrolled from ac where identity=1";
        //number of participants expected
        $query5 = "Select participantsExpected from ac where identity=1";
        //number of participants unassigned
        $query6="Select participantsEnrolled from ac where identity=2";


        $result1 = mysql_query($query1) or die ('Could not find total');
        $res1= mysql_fetch_array($result1);
        $totalp[] = $res1['participantsExpected'];
        $totalp=json_encode($totalp);
        //echo ($totalp);

        $result2 = mysql_query($query2) or die ('Could not find neo chemoterapy');
        $res2 = mysql_fetch_array($result2);
        $chemop[] = $res2['participantsEnrolled'];
        $chemop= json_encode($chemop);

        $result3 = mysql_query($query3) or die ('Could not find surgery');
        $res3 = mysql_fetch_array($result3);
        $surgeryp[] = $res3['participantsExpected'];
        $surgeryp = json_encode($surgeryp);

        $result4 = mysql_query($query4) or die ('Could not find off study');
        $res4 = mysql_fetch_array($result4);
        $offp[] = $res4['participantsEnrolled'];
        $offp = json_encode($offp);
        //print_r($offp);

        $result5 = mysql_query($query5) or die ('Could not find expected');
        $res5 = mysql_fetch_array($result5);
        $expectp[] = $res5['participantsExpected'];
        $expectp = json_encode($expectp);
        //print_r($expectp);

        $result6 = mysql_query($query6) or die ('Could not find unassigned');
        $res6 = mysql_fetch_array($result6);
        $unassignp[] = $res6['participantsEnrolled'];
        $unassignp= json_encode($unassignp);
        //print_r($unassignp);
    ?>

        <link rel="stylesheet" type="text/css" href="./dijit/themes/claro/claro.css" />

    <script>dojoConfig = {parseOnLoad: true}</script>
    <script src="//ajax.googleapis.com/ajax/libs/dojo/1.8.1/dojo/dojo.js"
                   data-dojo-config="async: true"></script>
    <script>
    require([
         // Require the basic chart class
        "dojox/charting/Chart", 
        // Require the theme of our choosing
        "dojox/charting/themes/MiamiNice", 
        // Charting plugins: 
        //  We want to plot Columns
        "dojox/charting/plot2d/Columns",    
         //  We want to plot StackedColumns
        "dojox/charting/plot2d/StackedColumns", 
        //  We want to use Markers
        "dojox/charting/plot2d/Markers", 
        //  We'll use default x/y axes
        "dojox/charting/axis2d/Default",    
        //we'll use Legend
        "dojox/charting/widget/SelectableLegend", 
        // Wait until the DOM is ready
        "dojo/domReady!"
    ],
     function(Chart, theme) {

        // Define the data

        var total= <?php echo ($totalp); ?>;
        //alert(total);
        var chemo = <?php echo ($chemop); ?>;
        //alert(chemo);
        var surgery = <?php echo ($surgeryp); ?>;
        //alert(surgery);
        var offstudy = <?php echo ($offp); ?>;
        //alert(offstudy);
        var expected = <?php echo ($expectp); ?>;
        //alert(expected);
        var unassigned = <?php echo ($unassignp); ?>;
        //alert(unassigned);

        // Create the chart within it's "holding" node
        var chart = new Chart("chartNode");

        // Set the theme
        chart.setTheme(theme);

        // Add the only/default plot
        chart.addPlot("default", {
           type: "Columns",
           markers: true,
           shadows: {dx:2, dy:2, dw:2},
           gap: 2
        });

        // Add axes
        chart.addAxis("x", {title:"Arms", titleOrientation: "away", minorLabels: false, labels:[{value:0, text:""}, {value:1, text:""}, {value:2, text:"Off-Study"},{value:3, text: "Expected"}, {value:4, text:"Actual"}, {value:5, text:""}], rotation:-90});
        chart.addAxis("y", {title: "Participants", vertical: true, includeZero: true, ticks:true, majorLabels:false, minorLabels: false });

        // Add the series of data
        chart.addSeries("Off-Study", offstudy, {fill:"gray"});
        chart.addSeries("Expected", expected, {fill:"gray"});
        chart.addSeries("Unassigned", [0,0,0,unassigned,0], {stroke:"#FF0000", fill:"#CC6600"});
        chart.addSeries("Surgery", [0,0,0,surgery,0], {stroke:"#FFFF00", fill:"#FFFF33"});
        chart.addSeries("Neo Chemoterapy", [0,0,0,chemo,0], {stroke:"#FF0099", fill:"#FEA9F3"});
        chart.addSeries("Total", [0,0,0,total,0], {stroke:"black", fill:"black"});  

        // Render the chart!
        chart.render();
        var legend1 = new dojox.charting.widget.SelectableLegend({chart: chart, horizontal:true}, "legend1");

    });

    </script>

    <div id="chartNode" style="width:500px;height:450px;"></div>
    <div id="legend1"></div>

Dani AI

Generated

Good catch, — the root cause was that the values coming from PHP were being embedded as JSON single‑element arrays and then used inside other JS arrays, which produced nested arrays instead of numeric scalars. Dojo expects numbers (or arrays of numbers) for a series; a nested array in place of a number prevents the plot from rendering.

Two safe fixes (pick one):

  • Emit a numeric scalar from PHP so the JS variable is a number, not an array. Example PHP output for a single value:

    <?php
    // emit a numeric JSON literal (no array wrapper)
    echo json_encode((int)$row['participantsExpected']);
    ?>
  • Or keep the current PHP output but normalize in JavaScript before passing values to the chart. If the server output is a single‑element array, extract and convert it:

    var totalArr = <?php echo $totalp; ?>;    // e.g. a JSON array
    var totalNum = Number(totalArr[0]);      // ensure a numeric scalar
    chart.addSeries("Total", [0,0,0,totalNum,0], {...});

Quick troubleshooting checklist:

  • Open the page source (or use DevTools) to verify exactly what the PHP emitted — confirm whether the JS var is a number, a string, or an array.
  • Use console.log(...) to inspect variables before calling addSeries.
  • Ensure the series arrays match the x‑axis positions you intend (length and indexes).
  • Convert strings to numbers with Number(), parseInt(...,10), or parseFloat when appropriate.

Optional improvement: switch from deprecated mysql_* functions to mysqli or PDO with prepared statements for security and future compatibility.

I guess the value format is incorrect. I am trying to get a specific value so it can be placed in the addSeries and display the graph. For now, I see I am getting the value in this format ["42"], and maybe that's the reason the addSeries can't recognize it. How can I get the clean value?

Thanks

I found the problem:

I just changed the following lines for all the queries results.

 $result1 = mysql_query($query1) or die ('Could not find total');
    $res1= mysql_fetch_array($result1);
    $totalp = $res1[0];
    //$totalp=json_encode($totalp);
    //echo ($totalp);
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.