2012-03-24 10 views
0

UPDATE Ich habe meinen Code in Reaktion auf @MichaelRushton Kommentare aktualisiert. Ich verwende jetzt Highcharts, aber ich habe Probleme, die Daten in die Datenreihe zu übertragen.Generieren eines Highchart basierend auf der Ausgabe eines Arrays

Ich habe jetzt das folgende Array aus einer MySQL-Abfrage generiert, und ich möchte es in ein Liniendiagramm ausgeben. Meine Y-Achse sollte den Betrag enthalten, X-Achse ist der Datumsbereich und Legende sind die verschiedenen Elemente, die im Diagramm gezeichnet werden.

// Call the stored procedure 
    $stmt->execute();      

    while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) { 
     $array[$row['legend']][$row['date']] = $row['amount']; 
     //print_r($array); 
    } 


    chart = new Highcharts.Chart({ 

    chart: { 
    renderTo: 'container', 
    type: 'line' 
    }, 

    xAxis: 
    { 
    categories: [2012-03-01, 2012-03-02, 2012-03-03, 2012-03-04, 2012-03-05, 2012-03-06, 2012-03-07, 2012-03-08, 2012-03-09, 2012-03-10, 2012-03-11, 2012-03-12, 2012-03-13, 2012-03-14, 2012-03-15, 2012-03-16, 2012-03-17, 2012-03-18, 2012-03-19, 2012-03-20, 2012-03-21, 2012-03-22, 2012-03-23, 2012-03-24, 2012-03-25, 2012-03-26, 2012-03-27, 2012-03-28, 2012-03-29, 2012-03-30, 2012-03-31], 
    }, 

    series: 
    [ 

<?php 
    foreach ($array as $legend => $data) 
     { 
      echo '{'; 
      echo "name: '" . $legend . "',"; 

      $values = array(); 

      for ($i = 1; $i <= 31; ++$i) 
      { 
      $values[] = isset($data[$i]) ? $data[$i] : 0; 
      } 

      echo 'data: [' . implode(', ', $values) . '],'; 
      echo '},'; 

     } 
?> 
], 
} 
); 

<div id="container" style="width: 100%; height: 400px"></div> 
) 

Dieser Code präsentiert mich mit der folgenden Ausgabe:

series: [ {name: 'Something Tastier',data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],},{name: 'Something Tasty',data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],}, ], }); 

Das scheint richtig, außer es keine Werte an die Datenreihe ausgibt. Wenn jemand weitere Ideen hat, würde es sehr geschätzt werden.

Antwort

1

Highcharts ist meine Lieblingsoption für Graphen. Es könnte sich lohnen, Ihre Array Strukturierung aussehen:

Array (

    [legend_one] => Array 
    (

    [2012-03-01] => 100 
    [2012-03-02] => 200 
    [2012-03-03] => 300 
    ... 

) 

    [legend_two] => Array 
    (

    // Day of the month  
    [2012-03-01] => 100 
    [2012-03-02] => 200 
    [2012-03-03] => 300 
    ... 

) 

    ... 

) 

Sie dann Highcharts wie diese verwenden:

Edit: Jetzt vollständige Datum verwendet und nicht nur Tag, den Monat dynamisiert (mit $start Variable), und startete den Tag Iterator bei 0 statt 1, um die Notwendigkeit $i - 1 zu entfernen, wenn strtotime verwendet wird, um das nächste Datum zu berechnen.

chart = new Highcharts.Chart({ 

    xAxis: 
    { 

    categories: [ 

<?php 

     // You could dynamically set this date using $_GET/$_POST 
     $start = '2012-03-01'; 

     $dates = array(); 

     for ($i = 0, $days = date('t', strtotime($start)); $i < $days; ++$i) 
     { 
     $dates[] = date('Y-m-d', strtotime($start . ' + ' . $i . ' day')); 
     } 

     echo "'" . implode("', '", $dates) . "'"; 

?> 

    ], 

    }, 

    series: 
    [ 

<?php 

    foreach ($array as $legend => $data) 
    { 

     echo '{'; 

     echo "name: '" . $legend . "',"; 

     $values = array(); 

     for ($i = 0; $i < $days; ++$i) 
     { 

     $date = date('Y-m-d', strtotime($start . ' + ' . $i . ' day')); 

     $values[] = isset($data[$date]) ? $data[$date] : 0; 

     } 

     echo 'data: [' . implode(', ', $values) . '],'; 

     echo '},'; 

    } 

?> 

    ], 

} 
); 
+0

Hallo Michael, das sieht sehr nützlich aus Dank. Ich verwende derzeit PDO $ stmt-> fetchAll (PDO :: FETCH_ASSOC); um mein Array zu rendern. Irgendwelche Ideen, wie ich die Ausgabe an das von Ihnen vorgeschlagene Array ändern könnte? –

+1

Iterate über das Ergebnis und tun $ Array [$ Zeile ['Legende']] [$ Zeile ['Tag']] = $ Zeile ['Betrag']; ' – MichaelRushton

+0

Danke Michael Code scheint jetzt dort zu bekommen. Ich habe Probleme, die Datenreihen aktualisiert zu bekommen. –

0

Du gehst in die falsche Richtung. Wenn Sie nach etwas suchen, das bereits verfügbar ist, sollten Sie die Daten so ausgeben, sie akzeptieren. Nicht umgekehrt.

Mit diesem gesagt, versuchen Sie pChart. Es hat breite Unterstützung für verschiedene Formate.

Verwandte Themen