Ankündigung

Einklappen
Keine Ankündigung bisher.

Zeitbalken / ZeitSkala erstellen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Zeitbalken / ZeitSkala erstellen

    hi leute

    wie kann ich einen balken in mehere teile teile?

    folgendes möchte ich gerne haben, zeitbalken der dann geteilt wird nach arbeits zeiten. also zb so das von 7-9 rot ist und dann halbe stunde pause weis und dann weiter so ...

  • #2
    Eine Möglichkeit wäre mehrere Images nebeneinander zu legen. Aber was hast du bisher versucht?

    Kommentar


    • #3
      tja - dann schau dir mal die GD-Funktionen an (imagecreatetruecolor und folgende),
      damit malst du dir deinen Zeitbalken in vernünftiger Abmessung, so dass du leicht Stunden "abgrenzen" kannst - etwa 480 px lang = 20 px pro Stunde... den malst du in deiner gewählten Farbe 1 ...
      dann ermittelst du die Anfangszeit (9:30 =9,5 * 20 px) , die Endzeit (13:30 = 13,5 * 20 px) - und malst diesen Teil des Balkens nochmal mit einer anderen Farbe...

      http://de2.php.net/manual/en/ref.image.php <-- hier findest du dein Handwerkszeug

      Kommentar


      • #4
        Die eierlegende Wollmilchsau gibts leider noch nicht. Was hast du denn als Ansatz?

        Hier paar Helferlein (direkt ausm feedreader):

        Peity is a jQuery plugin for creating word-sized charts (sparklines) using HTML5 <canvas>.
        Columnal is a CSS framework which is a remix of the popular frameworks 960.gs and 1140px Grid with some improvements.
        Sencha /ExtJS


        Grüße


        Basti

        Kommentar


        • #5
          edit: sry, doppelpost

          Kommentar


          • #6
            ich hatte bis jetzt nur einen zeitbalken mir gebaut und nu wollte ich den teilen aber da bin ich nicht richtig vorran gekommen.

            aber werd das mal so probieren wie eagle275 gesagt hat.

            Kommentar


            • #7
              Die Image-Funktionen zu benutzen, ist meiner Meinung nach hier zu aufwändig.
              Code:
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
              <head>
              <title>Farbbalken</title>
              <style type="text/css">
              <!--
              .img {  float:left; padding:0px; margin:0px; height:30px;}
              -->
              </style>
              </head>
              <body>
              <img class="img" style="width:30px;" src="./red.png" alt="" />
              <img class="img" style="width:60px;" src="./grey.png" alt="" />
              <img class="img" style="width:40px;" src="./green.png" alt="" />
              <img class="img" style="width:20px;" src="./yellow.png" alt="" />
              </body>
              </html>
              Für die jeweiligen Farben ein Image mit 1px Breite erstellen und per Script die Breite in Pixel ausrechnen und im Style setzen.

              Kommentar


              • #8
                so also bin grade am testen, aber komm nicht vorran, wenn ich das testen will zeigt der bei mir nur text an aber kein bild oder so, weis jemand woran das vlt liegt ?

                Kommentar


                • #9
                  Pfad zum Bild richtig? Und ohne deinen Quellcode können wir nicht viel machen.

                  Kommentar


                  • #10
                    ich hab nur mal den standart text getestet, aber der geht ni.
                    Code:
                    <?php
                    header ('Content-Type: image/gif');
                    $im = @imagecreatetruecolor(120, 20)
                          or die('Cannot Initialize new GD image stream');
                    $text_color = imagecolorallocate($im, 233, 14, 91);
                    imagestring($im, 1, 5, 5,  'A Simple Text String', $text_color);
                    imagepng($im);
                    imagedestroy($im);
                    ?>
                    so schaut das bei mir aus ...

                    Kommentar


                    • #11
                      header ('Content-Type: image/gif');
                      :
                      imagepng($im);

                      Und wo füllst du mit Farbe??? Bei deinen aktuellen PHP-Kenntnissen würde ich lieber meinen Vorschlag verfolgen und die Image-Funktionen ignorieren

                      <edit>
                      Zitat von krusty88 Beitrag anzeigen
                      so schaut das bei mir aus ...
                      Du darfst das Script auch nicht in HTML-Code einbinden! Mach das so: <img src="deinScript.php">

                      Und Beiträge ändern, nachdem schon jemand geantwortet hat, ist meist unschön!
                      </edit>

                      Kommentar


                      • #12
                        sry, hatte das erst nach dem edit gesehen das schon ne 2te seite da ist. ok wenn du das sagst werd ich das mal so testen wie du das vorgeschlagen hast.

                        Kommentar


                        • #13
                          so hab jetzt mein script fertig gebastelt...

                          PHP-Code:
                          <?php
                          $datei 
                          file("test.txt"); //datei öffnen

                          foreach($datei AS $berechnung// umbenennung in ausgabe
                             
                          {
                             
                          $zerlegen explode(","$berechnung); // teilen der zeichen
                              
                          $stunde "$zerlegen[3]";  //stunden 
                              
                          $minute "$zerlegen[4]";
                              
                          $stunden_in_min 60;
                              
                          $gesamt = ($stunde $stunden_in_min) + $minute ;
                              
                              
                          $prozent_px 480 // 480px = 100% | 1% = 4.8px
                              
                          $prozent_min 1440// 1440min = 100% | 1% = 14.4min
                              
                          $ein_prozent_min 14.4;
                              
                          $ein_prozent_px 4.8;
                              
                              
                          $prozent_min_1 $gesamt $ein_prozent_min ;
                              
                          $in_px $prozent_min_1 $ein_prozent_px;
                              
                              
                          //echo "$in_px <br / >";
                              
                              
                              
                          }
                                  
                          ?>
                          das funktioniert auch so wie ich das möchte, jetzt nur meine frage wie bind ich das am einfachste in die css ein bzw in den vorschlag von phptt?

                          und dann noch eine frage gibt es kein gutes tut für die GD funktion ?

                          danke für eure hilfe

                          Kommentar


                          • #14
                            also eigentlich sind für die GD-Funktionen die user-Kommentare aus dem Manual schon hinreichend - zumal mit Kommentaren versehen ... Ich hab aber mit ein wenig Googlen ein paar Anleitungen für etwas speziellere Operationen gefunden (vor allem was Blending / Filterung angeht)

                            Kommentar


                            • #15
                              so habs geschaft, bin fertig und hab das gewünschte ziel erreicht, danke für eure hilfe.

                              nur noch eine frage wie kann ich das jetzt noch machen das ein balken nach den anderen angezeigt wird ?

                              PHP-Code:
                              <?php
                              $datei 
                              file("test.txt"); //datei öffnen

                              foreach($datei AS $berechnung// umbenennung in ausgabe
                                
                                 
                              $zerlegen explode(","$berechnung); // teilen der zeichen
                                  
                              $stunde "$zerlegen[3]";  //stunden 
                                  
                              $minute "$zerlegen[4]";
                                  
                              $stunden_in_min 60;
                                  
                              $gesamt = ($stunde $stunden_in_min) + $minute ;
                                  
                                  
                              $prozent_px 480 // 480px = 100% | 1% = 4.8px
                                  
                              $prozent_min 1440// 1440min = 100% | 1% = 14.4min
                                  
                              $ein_prozent_min 14.4;
                                  
                              $ein_prozent_px 4.8;
                                  
                                  
                              $prozent_min_1 $gesamt $ein_prozent_min ;
                                  
                              $in_px $prozent_min_1 $ein_prozent_px;
                                  
                                  
                              //echo "$in_px <br / >";
                                  
                                  //Balken
                                  
                              $im imagecreate(480,20);
                                  
                              $grau imagecolorallocate($im220220220); // hintergrund balken
                                  
                              imagefill ($im00$grau);
                                  
                              $s imagecolorallocate($im000191255); //füllfarbe balken
                                  //imagerectangle($im, 95, 0, 0, 19, $s);
                                  
                              imagefilledrectangle($im$in_px0019$s);
                                  
                              //imagefilledrectangle($im, 185, 0, 289, 19, $s);
                                   
                                  
                              header("Content-Type: image/jpeg");
                                  
                              imagejpeg($im);
                                  
                              imagedestroy($im);
                              ?>

                              Kommentar

                              Lädt...
                              X