Ergebnis 1 bis 4 von 4

Thema: Balkendiagramm

  1. #1
    Samurai Avatar von Donkey
    Registriert seit
    12.08.2008
    Ort
    München
    Alter
    35
    Beiträge
    237
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Balkendiagramm

    Wenn man mal nach Balkendiagramm googlet findet man hauptsächlich so nette Tuts die auf imagecreate() bauen oder JavaScript-Lösungen.

    Geht aber auch ohne Grafiken oder JavaScript und is ganz einfach mit ein bisschen CSS und PHP.

    CSS: Hintergrund des Balkens
    Code:
    .diahg
    {
        width:20em; /* Gesamtbreite des Balkens */
        height:1em; /* Gesamthöhe des Balkens */
        background-color:#999999; /* Hintergrund des Balkens */
    }
    CSS: Vordergrund des Balkens
    Code:
    .diavg
    {
        height:100%; /* An Hintergrund anpassen */
    
        /* Schrift im Vordergrund-Balken */
        font-size:0.8em;
        font-weight:bold;
        text-align:right;
    }

    Die Breite und die Farbe des Vordergrunds werden im style-Attribut mit PHP festgelegt.

    PHP-Code:
    <div class="diahg">

        <?php echo'<div class="diavg" style="width:'.$width.'%; background-color:#'.$color.';">'.$width.'%</div>'?>

    </div>

    Beispiel:
    PHP-Code:
    <?php
        
    // Werte aus einer Datenbank oder woher auch immer
        
    $width '40';
        
    $color 'ffaa00';
    ?>
    Ergebnis:




    Gruss, Donkey
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!


  2. #2
    Thonixx
    Gast

    Standard AW: Balkendiagramm

    Hehe, was ganz einfaches.
    Wär selber nicht auf die Idee gekommen, aber im Grunde ganz simpel.

    Einfach normales CSS.
    Wenn du jetzt noch ein Kuchendiagramm darstellen lassen könntest, dann wärst du Profi .

    Aber ehrlich gesagt ein richtiges Script ist das auch nicht, na? :P

  3. #3
    Samurai
    Themenstarter
    Avatar von Donkey
    Registriert seit
    12.08.2008
    Ort
    München
    Alter
    35
    Beiträge
    237
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Balkendiagramm

    Wenn Dir ein eckiger Kuchen recht is...

    Stimmt, hätte wohl besser ins Tutorial-Forum gepasst.
    Vielleicht verschiebts ja ein Mod


  4. #4
    Azubi(ne)
    Registriert seit
    11.08.2009
    Beiträge
    88
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    5

    Standard AW: Balkendiagramm

    Nettes kleines Tutorial .

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •