0

I used Morris chart in my application project to show some details about quantity of sales. After executing the AJAX request, the chart is showing data in disordered way.It doesn't display sales for each city.I want to display them like this example with static data http://jsfiddle.net/marsi/LaJXP/1/

var json = (function () {
        var json = null;
        $.ajax({
            'async': false,
            'global': false,
            'url': 'sales.php',
            'dataType': "json",
            'success': function (data) {
                json = data;
            }
        });

        return json;
    })
    ();


    Morris.Area({
    element: 'graph-area',
    padding: 10,
    behaveLikeLine: true,
    gridEnabled: false,
    gridLineColor: '#dddddd',
    axes: true,
    fillOpacity:.7,
    data:json,
    lineColors:['#ED5D5D','#D6D23A','#32D2C9'],
    xkey: 'data',
    ykeys:['cityname','total'],
    labels: ['city','total'],

    pointSize: 0,
    lineWidth: 0,
    hideHover: 'auto'
});


<div id="graph-area"></div>

The result from json file (sales.php) looks like :

[{"cityname":"Modena","total":"810.82","data":"2014-02-05 16:55:52"},
 {"cityname":"Bologna","total":"396.22","data":"2014-02-09 23:58:20"},
 {"cityname":"Rimini","total":"380.00","data":"2014-02-10 10:36:12"},
 {"cityname":"Bologna","total":"736.30","data":"2014-02-10 23:30:58"},
 {"cityname":"Bologna","total":"0.00","data":"2014-02-12 23:41:52"},
 {"cityname":"Modena","total":"0.00","data":"2014-02-13 15:21:17"}]

Any ideas?Thanks in advance.

2
Contributors
2
Replies
20
Views
3 Years
Discussion Span
Last Post by marse.haka91
0

See http://jsfiddle.net/58aQe/1/

Data example should be as follows, but to have effective results, the y keys need to share time intervals so that each city reports a number at the same point in time.

[{period:"2014-02-05",Modena:810, Bologna:0, Rimini:0},
                  {period:"2014-02-09",Modena:0, Bologna: 396, Rimini:0},
                 {period:"2014-02-10",Modena:0, Bologna:0, Rimini: 380},
                 {period:"2014-02-10",Modena:0, Bologna: 736, Rimini:0},
                 {period:"2014-02-12",Modena:0, Bologna: 0.00, Rimini:0},                 
                  {period:"2014-02-13",Modena: 0, Bologna:0, Rimini:0}]
0

Yes,I understand but my json file get data in this format.

$query = "SELECT cityname, totalamount, createdtime
FROM vtiger_city
INNER JOIN vtiger_contract ON vtiger_city.cityid = vtiger_contract.centro
INNER JOIN vtiger_crmentity ON vtiger_crmentity.crmid = vtiger_contract.contractid
WHERE vtiger_crmentity.deleted =0 group by createdtime order by createdtime" ;
    $result = mysql_query($query) or die("SQL Error 1: " . mysql_error());
    // get data and store in a json array
         $verb = $_SERVER["REQUEST_METHOD"];

    // handle a GET 
    if ($verb == "GET") {
    while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
        $city[] = array(
            'cityname' => $row['cityname'],

                         'total' =>$row['totalamount'],

                        'data' =>$row['createdtime'],
          );
             }  

 header("Content-type: application/json");
    echo json_encode($city);
    }
?>     

How can i call them differently?

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.