Transformer JSON dans le format correct pour mettre en Morris Graphique à barres plugin

Je suis en utilisant le Morris Graphique à barres plugin. Vous pouvez voir un exemple ici.

Le bon format de données à insérer dans le tableau est le suivant:

data: [
    { y: '2006', a: 100, b: 90 },
    { y: '2007', a: 75,  b: 65 },
    { y: '2008', a: 50,  b: 40 },
    { y: '2009', a: 75,  b: 65 },
    { y: '2010', a: 50,  b: 40 },
    { y: '2011', a: 75,  b: 65 },
    { y: '2012', a: 100, b: 90 }
  ],

Je veux remplir cette info mais avec une requête ajax PHP.

$.ajax({
    url: 'getchart.php',
    success: function(content){

        console.log(content); //Native return

        var element = [];   
        var json    = JSON.parse(content);

        for(var i = 0; i <= json.length - 1; i++){
            element[i] = {y: json[i][0].month, a: json[i][0].total};
        }

        console.log(element);
    }
});

J'ai réaliser la demande avec succès mais j'ai besoin de convertir au format json-je obtenir de l'ajax pour le format morris graphique besoins.

[[{"total":1,"Month":7,"description":"Started"},
{"total":1,"Month":6,"description":"Started"}],
[{"total":3,"Month":6,"description":"Started"}]]

Le code ci-dessus est ce que la variable content de sortie. Le problème ici est que l'un index contient 2 sous-index et les autres index ne contient qu'un sous-indice:

Indice 1:

[{"total":1,"Month":7,"description":"Started"},
 {"total":1,"Month":6,"description":"Started"}],

Et le deuxième index ne contient qu'un seul sous-indice

Indice 2:

[{"total":3,"Month":6,"description":"Started"}]],

Cela se produit parce que je suis poussant deux tableaux en un en PHP.

$AN = $chart->chartAN(); //Apresentation and Negociation
$AC = $chart->chartAC(); //Accomplished

$final = array($AN, $AC);

echo json_encode($final);

Et, d'ailleurs, la sortie de deux fonctions est la même:

while($query->fetch()){     
  $rows[] = array("total" => $total, "month" => $month, "description" => $type);
}

Actuellement, le console.log(element) me renvoie:

[Object, Object];
    > 0: Object
        a: 1
        y: 7

    > 1: Object
        a: 3
        y: 6

Mon résultat final, je voudrais faire quelque chose comme:

element: [
          { y: 'April', a: value_from_chartAN, b: value_from_chartAC },
          { y: 'May',   a: value_from_chartAN, b: value_from_chartAC },
         ],

MODIFIER: afin De clarifier la question (parce que je sais n'est pas simple).

Je voudrais que mon sortie:

element: [
              { y: month_from_database, a: value_from_chartAN, b: value_from_chartAC },
              { y: month_from_database, a: value_from_chartAN, b: value_from_chartAC },
             ],

Depuis value_from_chartAN ou value_from_chartAC peut être null, il faut ajouter le nombre 0.
Si vous regardez l'exemple de Morris: http://jsbin.com/uzosiq/258/embed?javascript,en direct

L'année correspondent à mon Mois, la barre bleue à la value_from_chartAN et la barre grise à value_from_chartAC.

Pour aplatir le tableau json retourné dans le navigateur-pour se débarrasser des deux index problème, voir: stackoverflow.com/questions/10865025/...
Je ne vois pas où la valeur de b: dans votre sortie attendue est censé venir de, et la valeur de y: devrait logiquement être une année (2014), mais vous voulez qu'il soit un mois (avril)? Veuillez éditer votre question à clarifier
Je viens de mettre à jour mon sujet.
OK, mauvais jour de ma réponse avec une solution

OriginalL'auteur Linesofcode | 2014-06-19

Le problème principal est que votre PHP valeurs de retour (votre JSON que vous enverrez) n'est pas sur la même structure que de besoin par le graphique à barres. Vous devez l'aplatir en premier. De là, vous code devrait fonctionner correctement. Exemple de Violon

Considérons cet exemple:

<?php
if(isset($_POST['get_values'])) {
    //replication of your data
    $final = '[[{"total":1,"Month":7,"description":"Started"},{"total":1,"Month":6,"description":"Started"}],[{"total":3,"Month":6,"description":"Started"}]]';
    $final = json_decode($final, true);
    $new_final = array();
    //simple flattening
    foreach($final as $value) {
        foreach($value as $sub_value) {
            $new_final[] = $sub_value;
        }
    }

    echo json_encode($new_final);
    exit;
}

?>

<div id="bar-example"></div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="http://cdn.oesmith.co.uk/morris-0.4.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    $.ajax({
        url: document.URL, //getchart.php
        dataType: 'JSON',
        type: 'POST',
        data: {get_values: true},
        success: function(response) {
            Morris.Bar({
                element: 'bar-example',
                data: response,
                xkey: 'description',
                ykeys: ['Month', 'total'],
                labels: ['Month', 'Total']
            });
        }
    });

});
</script>

Pour ce que j'ai essayé jusqu'à présent, cela semble fonctionner. Mais je vais déjeuner à l'heure et quand je reviens, je vais le tester dans une meilleure façon votre code. Après que je vais venir ici et de vous dire. Merci.
ok, vous pouvez vérifier le violon au-dessus et juste la tripoter de partout. sûr pas de problème
Ok, j'ai fait quelques modifications, mais à la fin, a parfaitement fonctionné. Je vous remercie.

OriginalL'auteur user1978142

Vous contrôlez les données envoyées par le serveur, assurez-vous donc de son dans le bon format avant de l'envoyer simplement fusionner les tableaux php en un seul, et de définir le bon en-tête:

$final = array_merge($AN, $AC);
header('Content-Type: application/json');
echo json_encode($final);

Maintenant, vous avez exactement le format que vous désirez retourner à votre ajax fonction, aucune autre js de traitement requis:

$.ajax({
    url: 'getchart.php',
    success: function(content){
        console.log(content); //Native return is as required

    }
});

MODIFIER selon vos éclaircissements. La solution est encore pour envoyer le bon de données à partir de php, mais le code est un peu plus compliqué:

//simulated calls to your functions, based on your posted data
$an = json_decode('[{"total":1,"Month":7,"description":"Started"}, {"total":1,"Month":6,"description":"Started"}]', true);
$ac = json_decode('[{"total":3,"Month":6,"description":"Started"}]', true);


//1st create an array from the $ac data that uses the month value as the key, 
//so we can check if  any month is contained in the array simply:    
$ac_new=array();
foreach($ac as $item){
    $month = $item['Month'];
    $ac_new[$month] = $item['total'];
}
//array to hold are final data
$data = array();

foreach($an as $item){
    $y = $item['Month'];
    $a = $item['total'];

    //if there is a value for this month in ac_new array, set $b to its value
    //and then remove the element from the ac_new array, else set $b = 0
    if(isset($ac_new[$y])){
        $b = $ac_new[$y];
        unset($ac_new[$y]);
    }else{
        $b = 0;
    }
    $data[] = array('y' => $y, 'a' => $a, 'b' => $b);
}

//if there any elements left in $ac_new then they are for months 
//not included in $an array, so value for a must be 0
if(count($ac_new)>0){
    foreach($ac_new as $key => $value){
        $data[] = array('y' => $key, 'a' => 0, 'b' => $value);
    }
}

//return correctly formatted data
header('Content-Type: application/json');    
echo json_encode($data);

Ce n'est pas ce que je cherche (je suppose). Comment puis-je avoir le résultat que j'ai dit à la fin du post?
Pourquoi, il ne comprends pas?
J'ai essayé votre solution mais je ne comprends pas comment il va ot m'aider à atteindre ce désir de sortie.
Ok, je vois ce que tu veux dire - votre question est un peu déroutant et il me manque juste la façon dont vous voulez formater les données. J'éditerai avec une solution bientôt
Veuillez voir mon montage pour une solution

OriginalL'auteur Steve

<?php
session_start();
include("../phpfiles/include/Config.php"); //db connect
$dbc = @mysqli_connect(DB_HOST,DB_USER,DB_PASSWORD,DB_DATABASE);
if(!$dbc)
{
trigger_error('Could not connect to MySql:'. mysqli_connect_error());
}
$query = "SELECT dateandtime,sum(grandtotal) FROM bb_pos.bb_bill
group by MONTH(dateandtime), YEAR(dateandtime) order by dateandtime DESC limit 12 "; //last 12 month in descending order
$result = mysqli_query($dbc, $query);
$cart = array();
while($row = mysqli_fetch_array($result,MYSQLI_ASSOC))
{
$date = $row['dateandtime'];
$time=strtotime($date);
$month=date("F",$time);
$year=date("Y",$time);
array_push($cart,array(
'period'=>$month." ".$year,
'SALE'=>$row['sum(grandtotal)']));
}
echo json_encode($cart);
mysqli_close($dbc);
?>  
<body>
<div class="x_content1">
<div id="graph_bar_group" style="width:100%; height:280px;"></div>
</div>
</body>
<script>
$.getJSON('morrisdata.php', function(data) 
{
var date = data;
function custom_sort(a, b) {
return new Date(a.period).getTime() - new Date(b.period).getTime();
}   
date.sort(custom_sort); //convert the last 12 months in ascending order
//var product_name = data.name;
Morris.Bar({
element: 'graph_bar_group',
data: data,
xkey: ['period'],
ykeys: ['SALE'],
labels: ['SALE'],
hideHover: 'auto',
resize: true,
parseTime: false,
xLabelAngle: 60
});
});
</script>

Pourriez vous s'il vous plaît ajouter un peu de contexte sur la façon dont ce code aider à résoudre le cas des OP problème? Bloc de Code décharges, sans explication, sont généralement mal vu
Je ne sais pas à propos de l'OP du problème?
Vous êtes à la recherche pour obtenir de l'aide? Si oui, vous avez besoin de poster une nouvelle question, pas une réponse sur une ancienne. Je vous recommande également écrit à propos de ce que le problème que vous avez est.
je m de ne pas poser de nouveau la question. ses la solution pour ceux qui veulent montrer des données réelles sur Morris Graphique à barres. Comme je n'ai pas trouvé de solution pour Morris Graphique à barres. Après avoir cherché tant pour google et de dépassement de pile puis je m en mesure de le faire fonctionner pour moi. j'ai donc envie de partager avec d'autres personnes
Si ce n'aborde pas spécifiquement cette OP problème, il ne devrait pas être une réponse ici. Au lieu de cela, écrire votre propre question et après cette réponse (auto-réponse Q&A est parfaitement bien).

OriginalL'auteur waheed shah

Vous devez vous connecter pour publier un commentaire.