Multidimensional array json_encoded

Question

I try to return a multidimensional array of dates and revenues each date as JSon array in order to display a chart in my panel dashboard. Unfortunately the chart makes some problem, when I don't hardcode my JSon Array, thus I am debugging it right now and I wonder why my json_encoded array looks so strange.

This is my Panel, which draws the chart and requests the data from data.php:

jQuery.getJSON("data.php", { request: "revenues" }, function (result) {
    var revenues = result["amount"];
    alert(revenues);
    $(".monthly-sales").sparkline(revenues, {
        type: 'bar',
        barColor: '#ff4e50',
        height: '55px',
        width: '100%',
        barWidth: 8,
        barSpacing: 1
    });
});

The data.php:

elseif($request == "revenues"){
    // Output Revenues per day from nexus store
    $revenues = array();
    $revenues["dates"] = array();
    $revenues["amount"] = array();
    $sql = "select i_total as revenue, date(FROM_UNIXTIME(i_date)) as date FROM nexus_invoices WHERE i_status='paid' GROUP BY date(FROM_UNIXTIME(i_date)) ORDER BY i_date DESC LIMIT 0,10";
    $rows = $db->query($sql);
    foreach($rows as $row){
        $revenues["dates"][] = $row['date'];
        $revenues["amount"][] = floatval($row['revenue']);
    }
    //$revenues["amount"] = [1,5,5.5,5.4,5.8,6,8,9,13,12,10,11.5,9,8,5,8,9];
    echo json_encode($revenues);
}

The JSon result of this code is how I expect it:

{
    "dates":[
        "2015-06-13","2015-06-12","2015-06-10","2015-06-09","2015-06-07",
        "2015-06-06","2015-06-05","2015-06-04","2015-06-02","2015-05-31"
    ],
    "amount":[8,22,8,8,22,8,8,8,8,8]
}

Unfortunately this doesn't work for an unknown reason. To debug this further I have uncommented the line which hardcodes the $revenues["amount"] and commented the second line of the foreach. Then it worked fine. The result of this json_encoded echo is this:

{
    "dates":[
        "2015-06-13","2015-06-12","2015-06-10","2015-06-09","2015-06-07",
        "2015-06-06","2015-06-05","2015-06-04","2015-06-02","2015-05-31"
    ],
    "amount":[1,5,5.5,5.4,5.8,6,8,9,13,12,10,11.5,9,8,5,8,9]
}

How it looks like when I hardcode the array:

How it looks like when I fill the array from my database:

Answer 1

I think your problem is not in the json array rather the sparkline plugin.

try adding this when you display the DB data: chartRangeMin:5

$(".monthly-sales").sparkline(revenues, {
        type: 'bar',
        barColor: '#ff4e50',
        height: '55px',
        width: '100%',
        barWidth: 8,
        barSpacing: 1,
       chartRangeMin:5 
    });