Ausgabe der durchschnittlichen Bewertung

Wie man eine Bewertung mit Sternen ausgeben kann.

Da ich vor ein paar Tagen beschrieben habe wie Sie ein Bewertungsystem mit jQuery realisieren können, möchte ich heute was zu der Auswertung/Ausgabe schreiben. Ich gehe davon aus, dass Sie die Bewertungen in einer Datenbank speichern. Solch Tabelle wird vermutlich aus viel Spalten bestehen: ID, UserID, PostID, Vote. (Demo)

Als erste muss natürlich die durchschnittliche Bewertung des Eintrags berechnet werden. Da macht es uns MySQL besonders einfach. Es gibt bereits eine Funktion AVG(), die gleich den Durchschnitt berechnet.

$query = mysql_query("SELECT AVG(`Vote`) FROM `post_vote` WHERE  `PostID` = 1");
$v = mysql_fetch_assoc($query);

Die Variable $v[‚AVG(`Vote`)‘] beinhaltet nun die durchschnittliche Bewertung des Eintrags mit der ID 1.

Jetzt müssen wir nur noch eine Funktion basteln, die den Durchschnitt grafisch darstellt. Zur Darstellung habe ich die Stern-Icons von www.wefunction.com genommen. Fangen wir also an.

Als erstes müssen wir ausrechnen wie viele ganze Sterne angezeigt werden sollen. Dazu lassen wir die Ausgabe des ganzen Stern in einem for-Schleife durchlaufen, solange unser Counter kleiner/gleich der durchschnittlichen Bewertung ist. Den Counter starten wir natürlich bei 1. Ist der Durchschnitt also 3,5, so wird die Schleife drei Mal durchlaufen und es werden drei volle Sterne angezeigt.

3
4
5
  for($i=1; $i<=$rating; $i++) {
    $stars.= '<img src="star_48.png" alt="1" title="1" />';
  }

Nun müssen wir überprüfen, ob noch ein Rest vorhanden ist. (Wir gehen immer noch davon aus, dass die durchschnittliche Bewertung 3,5 ist!) Nach der for-Schleife hat die Variable $i einen Wert von 4. Jetzt können wir relativ leicht prüfen, ob es einen Rest gibt.

7
8
9
10
11
12
  $i -= 1;
 
  if(($rating-$i) >= 0.5) {
    $stars.= '<img src="star_half_48.png" alt="1/2" title="1/2" />';
    $i++;
  }

Ist die Bewertung (3,5) minus $i-1 (3) größer/gleich 0,5, so wird ein halber Stern ausgegeben. und der Wert von $i wieder um 1 Erhöht.

Jetzt brachen wir nur zu gucken, ob $i noch kleiner als 5 ist und falls ja eine for-Schleife, die so lange läuft bis $i den Wert 5 hat.

14
15
16
17
18
  if($i<5) {
    for($i; $i<5; $i++) {
      $stars.= '<img src="star_off_48.png" alt="0" title="0" />';
    }
  }

In unserem Beispiel hat $i wieder den Wert 4. Somit wird die for-Schleife ein Mal durchlaufen und der letzte, graue, Stern wird hinzugefügt.

Setzen wir die drei Schritte zusammen, so erhalten wir in der Ausgabe drei volle Sterne, einen halben und einen grauen. Also genau das was wir wollten. Hier ist noch einmal der gesamte Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function ShowStarsForRating($rating) {
 
  for($i=1; $i<=$rating; $i++) {
    $stars.= '<img src="star_48.png" alt="1" title="1" />';
  }
 
  $i = $i-1;
 
  if(($rating-$i) >= 0.5) {
    $stars.= '<img src="star_half_48.png" alt="1/2" title="1/2" />';
    $i++;
  }
 
  if($i<5) {
    for($i; $i<5; $i++) {
      $stars.= '<img src="star_off_48.png" alt="0" title="0" />';
    }
  }
 
  return $stars;
}

Nur sind wir auch schon wieder am Ende des Artikels angelangt. Ich wünsche Ihnen viel Spaß beim Rumprobieren!

Über Kommentare und Social Bookmarks würde ich mich sehr freuen.

ALL-INKL.COM