Diagramme erstellen mit Google Chart Tools

Nikas3D · 27 August 2011

Dazu habe ich direkt eine Frage! Ich nutze jetzt: Visualization: Area Chart - Google Chart Tools - Google Code

mein Code:

HTML:

                        <html>
                <head>
                    <script type="text/javascript" src="https://www.google.com/jsapi"></script>

                    <script type="text/javascript">
                        google.load("visualization", "1", {packages:["corechart"]});
                        google.setOnLoadCallback(drawChart);
                        function drawChart() 
                        {
                            var data = new google.visualization.DataTable();
                            data.addColumn('string', 'Datum');
                            data.addColumn('number', 'Kurs');
                            data.addColumn('number', 'Trades');
                            data.addRows([
                                <?php    
                                    $count_js = 0;
                                    while($count > $count_js)
                                    {
                                        $count_js = $count_js + 1;
                                        if($count == $count_js)
                                        {
                                            echo "[".$datenreihe[$count_js]."]";
                                        }
                                        else
                                        {
                                            echo "[".$datenreihe[$count_js]."],";
                                        }
                                        
                                    }
                                ?>
                            ]);
                            
                            var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
                            chart.draw(data, 
                            {
                                width: 1024, height: 786, title: 'Aktienkurs',
                                hAxis: {title: 'Aktienname', titleTextStyle: {color: '#FF0000'}}
                            });
                        }
                    </script>
                </head>
                <body></body>
            </html>

im Body Tag: (er zeigt den Inhahlt des Bodys oben nie an)

HTML:

<div id="chart_div"></div>

Aber es wird keine Grafik gezeichnet! wenn ich meine while konstruktion zum beispiel durch diese zeile ersetze:

['2004', 1000, 400],

klappt wieder alles!

Erklärung zu meinem Code:

Ich weiß nicht immer genau wie viele Einträge (punkte im Diagramm) ich haben werden, deswegen schreiber ich alle punkte in arrays
zähle diese mit $count und möchte sie dann angezeigt bekommen!
In diesem Fall sind folgende Varibalen so definiert:

$count = 3
$datenreihe[1] = '11.01.1970', 11, 50
$datenreihe[1] = '10.01.1970', 100, 1500
$datenreihe[1] = '09.01.1970', 80, 100

Ich bitte um Hilfe

NetAktiv · 27 August 2011

Hallo Nikas,
ich kenne die Tools nicht, aber bei Problemen geht man immer wie folgt vor:
man beginnt mit etwas einfachem, was funktioniert, und macht es Schritt für Schritt komplexer, bis das Problem auftritt.

1) In deinem Fall würde somit die While-Schleife entfernen und hartkodiert mehrere Messpunkte so eintragen, dass es geht.
2) Dann würde ich diese hartkodierten Messpunkte über PHP mit ein paar ECHOs eintragen lassen.
3) Zum Schluss dynamisch durch PHP.
Dabei vergleiche dann beim Schritt 3) den erzeugten HTML-Code mit dem von 2) und prüfe, ob die Syntax und Werte richtig sind.

Grüße, Rainer

Nikas3D · 27 August 2011

DAnke für die Tipps ich werde diese befolgen und gucken ob ich auf den Fehler komme

Ich habe jetzt heraussgefunden, dass nur ich nur $datenreihe[3] auslesen kann oder echo $datenreihe[$count];
$count ist aber auch 3! wenn ich $datenreihe[2 bzw: 1] einsetze wird nichts angezeigt

Ich weiß aber nicht warum

Gilles · 27 August 2011

Da es sich um eine Mischung aus PHP und Javascript Applikation handelt, solltest du erst einmal wissen auf welcher Seite der Fehler liegt.
Schritt 1: Schliesse JS Fehler aus. Wie du schon oben geschrieben hattest funktioniert das Graphenzeichnen, wenn du andere Werte für addRow einsetzt.
Somit funktioniert der "halbe" JS Teil schon einmal.
Schritt 2: Schau dir den HTML Quellcode an, den dein PHP erstellt. Sieht der denn richtig aus? Wenn dem so ist mache weiter mit Schritt 3.
Schritt 3: Überlege wie dein HTML Quelltext am Ende aussehen soll und schaue, was in deiner PHP Schleife fehlschlägt.

Nebenbei. Dein Array überschreibst du jedes mal aufs neue. wenn du echt immer $datenreihe[1] drin stehen hast.

Nikas3D · 27 August 2011

PHP:

                if(isset($count))
                {
                    $count   = $count + 1;
                }
                else
                {
                    $count = 1;
                }
                $datenreihe =  array($count => "['".$datum."', ".$kurs.", ".$trades."]");

So sieht meine Array belegung aus! Und ich denke nicht dass ich immer weider überschreibe denn ich kann immer echo $datenreihe[$count]."<br>";
anzeigen lassen! und es erscheint auch immer der gewollte text!

Dazu muss mann wissen mein Code hier in diesem Post steckt noch in einer do-while Schleife drin, sodass dieser Coed sooft ausgeführt soviele Einträge es inder Datenbank gibt!

Gilles · 27 August 2011

Als Tip.
Javascript kennt das JSON Format und PHP kennt es auch. (http://Json.org) Da du deine Sachen ja eh derzeit selber ins JSOn Format überträgst würde ich dir folgendes raten.
weit oben machst du folgendes:

PHP:

  $datenreihe = array();
  // Nun deine Schleife mit der Datenbank
  ...

  array_push($datenreihe,  array($datum, $kurs, $trades));

Dann wandelst du das ganze um in das json format. So sähe das dann aus.

HTML:

<script type="text/javascript">google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {    
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Datum');   
  data.addColumn('number', 'Kurs');    
  data.addColumn('number', 'Trades');    
  data.addRows(<?php  echo json_encode($datenreihe);  ?>);
  var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
  chart.draw(data,     {    width: 1024, height: 786, title: 'Aktienkurs',    hAxis: {title: 'Aktienname', titleTextStyle: {color: '#FF0000'}}    });}</script>

Macht dein HTML doch schon wesentlich schlanker oder? ;)

Nikas3D · 27 August 2011

Ich ich werde mit deinem Tipp versuchen meine Code zu überarbeiten und dann melde ich mich wieder!

aber was bedeutet/bezweckt/meinst du mit: $datenreihe = array();

Mein neuer Aufbau:

PHP:

<?php
$datenreihe        = array();
$abfrage1        = mysql_query("SELECT * FROM ...
if($row1 = mysql_fetch_object($abfrage1))  
{
    do
    {
     $kurs      = $row1-> ...
     array_push($datenreihe,  array($datum, $kurs, $trades));  
     } 
     while($row1 = mysql_fetch_object($abfrage1)); 
     ?>
         <html>
                <head>
                    <script type="text/javascript" src="https://www.google.com/jsapi"></script>

                    <script type="text/javascript">
                     ...
                     data.addRows
                            ([
                                <?php  echo json_encode($datenreihe);  ?>
                            ]);
                     ...
    
                    </script>
                </head>
                <body></body>
            </html>

Klappen will es aber nicht!

Meine Vermutung:

Im Quellcode erscheint:
[["11.01.1970","11","50"],["10.01.1970","100","1500"],["09.01.1970","80","100"]]

Es sollte aber dastehen:
['2004', 1000, 400],

also nur um das Datum ' .. ' und um die anderen Attribute nichts!
und die [-Klammer ganz zu Begin und ganz am Ende die ]-Klammer sollten auch nicht erscheinen, aber wie kann ich das ändern?

Gilles · 28 August 2011

Nikas3D schrieb:
Ich ich werde mit deinem Tipp versuchen meine Code zu überarbeiten und dann melde ich mich wieder!

aber was bedeutet/bezweckt/meinst du mit: $datenreihe = array();

Mein neuer Aufbau:

PHP:

<?php $datenreihe = array(); $abfrage1 = mysql_query("SELECT * FROM ... if($row1 = mysql_fetch_object($abfrage1)) { do { $kurs = $row1-> ... array_push($datenreihe, array($datum, $kurs, $trades)); } while($row1 = mysql_fetch_object($abfrage1)); ?> <html> <head> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> ... data.addRows ([ <?php echo json_encode($datenreihe); ?> ]); ... </script> </head> <body></body> </html>

Klappen will es aber nicht!

Meine Vermutung:

Im Quellcode erscheint:
[["11.01.1970","11","50"],["10.01.1970","100","1500"],["09.01.1970","80","100"]]

Es sollte aber dastehen:
['2004', 1000, 400],

also nur um das Datum ' .. ' und um die anderen Attribute nichts!
und die [-Klammer ganz zu Begin und ganz am Ende die ]-Klammer sollten auch nicht erscheinen, aber wie kann ich das ändern?

Das mit dem $datenreihe = array(); sagt PHP das $datenreihe ein leeres Array ist. Somit ist $datenreihe trotzdem ein Objekt vom Typ Array. Und array_push erwartet als erstes Argument ein objekt des Types Array.

Und nun zu deinem Quellcode.
du hast innerhalb von addrow ja imemr noch dein [ ] stehen. Das hatte ich extra bei mir weggemacht, da es vom JSON selbst mitgeliefert wird.
also bitte die reihe so abändern: data.addRows(<?php echo json_encode($datenreihe); ?>);

struppi · 28 August 2011

Nikas3D schrieb:
Klappen will es aber nicht!

Das ist keine Beschreibung eines Fehlers. Hast du mal in die Fehlerkonsole geschaut? Steht da eine Fehlermeldung? Der PHP Code ist i.O. und das Skript wird fehlerfrei bis zum Schluss ausgeführt?

Nikas3D · 28 August 2011

Nach der Änderung durch Gilles (<- Danke) gibt es keine Fehlermeldungen,
trotzdem wird das Diagramm nicht angezeigt!
Im Quellcode sieht man auch warum: Es steht da:

data.addRows([["11.01.1970","11","50"],["10.01.1970","100","1500"],["09.01.1970","80","100"]]);

Das müsste im Quellcode stehen: (Beispiel mit anderen Zahlen!)
data.addRows([['2004', 1000, 400],['2005', 1170, 460],['2006', 660, 1120],['2007', 1030, 540]]);

Alle drei Variablen werden als String deklariert und deswegen ".." darum gesezt.
Ich habe ausprobiert: Das Datum kann ich mit "" versehen da es in den Zeilen davor als string definiert wurde:

data.addColumn('string', 'Datum'); // x- Achse
data.addColumn('number', 'Kurs'); // y- Achse } 2 Areas
data.addColumn('number', 'Trades');// y- Achse } 2 Areas

Kurs und Trades sind aber !Zahlen!, es nützt auch nichts, 'number' in 'string' zu ändern weil, das diagramm zum punkte zeichnen Zahlen benötigt!

Ich brauche eine Möglichkeit das Format(string, zahl ..), der variablen die ich in den array speichere, bestimmen zu können!

struppi · 28 August 2011

Nikas3D schrieb:
Nach der Änderung durch Gilles (<- Danke) gibt es keine Fehlermeldungen,
trotzdem wird das Diagramm nicht angezeigt!
Im Quellcode sieht man auch warum: Es steht da:

data.addRows([["11.01.1970","11","50"],["10.01.1970","100","1500"],["09.01.1970","80","100"]]);

Dann stimmt etwas mit deinen Daten nicht, dabei können wir dir aber nciht helfen, da wir die Daten nicht kennen.

Nikas3D · 28 August 2011

Was haben denn meine Daten damit zu tuen? Das Format stimmt nicht!

Es muss doch irgendeine Möglichkeit geben dieses Problem zu beheben!
Ich muss doch irgendwie festlegen können!
$datum = text -> deswegen ""
$kurs = zahl -> deswegen keine ""

$trades und $kurs sind ja auch Zahlen nur durch das Schreiben in den Array werden sie automatisch zu Strings!
Das muss man doch beheben können!

struppi · 28 August 2011

Nikas3D schrieb:
Was haben denn meine Daten damit zu tuen? Das Format stimmt nicht!

Genau, du beantwortest hier deine Frage direkt selbst.

Nikas3D · 28 August 2011

struppi schrieb:
Genau, du beantwortest hier deine Frage direkt selbst.

$trades und $kurs sind ja auch Zahlen nur durch das Schreiben in den Array werden sie automatisch zu Strings!
Das muss man doch beheben können!

WIE KANN ICH DAS DENN JETZT ÄNDERN; DAUERN WIRD GESAGT; DAS FORMAT STIMMT NICHT DIE "" MÜSSEN WEG! ABER WIE???

struppi · 28 August 2011

Nikas3D schrieb:
WIE KANN ICH DAS DENN JETZT ÄNDERN; DAUERN WIRD GESAGT; DAS FORMAT STIMMT NICHT DIE "" MÜSSEN WEG! ABER WIE???

Warum schreist du? Wer sagt das dauernd? Die Anführungszeichen sollten nicht stören. Ich bin eher verwundert über die komischen Datumangaben. Ich glaube eher, dass an deinen Daten irgendetwas nicht stimmt. Laut Doku mach json_encode keine Anführungszeichen um Zahlen. Insofenr kann ich mich ur wiederholen, irgendetwas stimmt mit deinen Daten nicht.

struppi · 29 August 2011

struppi schrieb:
Die Anführungszeichen sollten nicht stören.

Also, ich hab's ausprobiert, sie stören doch. Die funktion isthier sehr streng, da es ja kein Problem wäre, solche Strings in Zahlen umzuwandeln. Insofern wäre aber nach wie vor das Problem, warum json_encode die Zahlen als Strings auszeichnet. Hier ist doe Vermutung, dass sie als char aus der Datenbank kommen, also wie ich schon sagte, dass etwas mit deinen Daten nicht stimmt.

Entweder du änderst es dort oder du musst den JSON String in PHP selber zusammen bauen.

Gilles · 29 August 2011

struppi schrieb:
Also, ich hab's ausprobiert, sie stören doch. Die funktion isthier sehr streng, da es ja kein Problem wäre, solche Strings in Zahlen umzuwandeln. Insofern wäre aber nach wie vor das Problem, warum json_encode die Zahlen als Strings auszeichnet. Hier ist doe Vermutung, dass sie als char aus der Datenbank kommen, also wie ich schon sagte, dass etwas mit deinen Daten nicht stimmt.

Entweder du änderst es dort oder du musst den JSON String in PHP selber zusammen bauen.

Die Vermutung, dass die Werte als String aus der Datenbank ausgelesen werden ist meines Erachtens nach richtig. Denn wenn ich numerische Werte in ein Array schreibe und dieses in JSON enkodiere, dann stehen da auch Zahlen und keine Strings drin.

Deswegen evtl so vorgehen

Code:

[COLOR=#000000][COLOR=#DD0000]array_push([/COLOR][COLOR=#0000BB]$datenreihe[/COLOR][COLOR=#DD0000],  array([/COLOR][COLOR=#0000BB]$datum[/COLOR][COLOR=#DD0000], [/COLOR][COLOR=#0000BB]intval($kurs)[/COLOR][COLOR=#DD0000], [/COLOR][COLOR=#0000BB]intval($trades)[/COLOR][COLOR=#DD0000])); 
[/COLOR][/COLOR]

Nikas3D · 29 August 2011

Warum schreist du?

Tut mir Leid, sollte nicht so rüberkommen

Danke Gilles und struppi!
intval war genau das, wonach ich gesucht habe!

Es sollte auch eigentlich ohne intval klappen, denn ich habe meine datenbank kontrolliert! Die Werte sind "int" und sie werde nauch als Zahlen ausgelesen!

Naja, aber mit intval habe ich das Problem nicht mehr!

Vielen Dank an die beiden!!

mermshaus · 30 August 2011

Es sollte auch eigentlich ohne intval klappen, denn ich habe meine datenbank kontrolliert! Die Werte sind "int" und sie werde nauch als Zahlen ausgelesen!

Ich hab's gerade mal getestet.

PHP:

<?php

mysql_connect('localhost', 'user', 'password');
mysql_select_db('database');

$result = mysql_query("SELECT id FROM table");

while ($row = mysql_fetch_assoc($result)) {
    var_dump($row);
}

Liefert lauter Strings, obwohl die Spalte auf int steht.

MySQL- und PHP-Datentypen sind nicht 1:1 deckungsgleich. Das kann ein Grund dafür sein. Ich muss aber zugeben, dass ich das auch aus dem Stegreif nicht wusste.

Nikas3D · 31 August 2011

Danke für deine "Entdeckung"!
Und ich dachte schon, ich wäre zu blöd meine Datenbank richtig zuführen!

Aber mit intval klappt der Code jetzt!

Diagramme erstellen mit Google Chart Tools

Neues Mitglied

Senior HTML'ler

Neues Mitglied

Blogger

Neues Mitglied

Blogger

Neues Mitglied

Blogger

struppi

Guest

Neues Mitglied

struppi

Guest

Neues Mitglied

struppi

Guest

Neues Mitglied

struppi

Guest

struppi

Guest

Blogger

Neues Mitglied

Senior HTML'ler

Neues Mitglied