IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Langage PHP Discussion :

Créer et remplir un tableau à deux dimensions


Sujet :

Langage PHP

  1. #1
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2019
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 28
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2019
    Messages : 13
    Par défaut Créer et remplir un tableau à deux dimensions
    Bonjour,
    Je viens de commencer PHP et malgré mes recherches je n'ai pas vraiment trouver de quoi m'aider.
    Je travaille sur un code me permettant de récupérer un flux ICS afin de le mettre sous forme de planning pour des réservations de salles. J'ai pu convertir mon ICS en format datetime avec ics-parser mais maintenant je bloque sur la création d'un tableau à 2 dimensions avec les différentes heures à gauche en colonnes et en haut en ligne les jours de la semaines.
    Et dans ce tableau, je chercherais placer les horaires déjà réservé pour une salle.
    Voici en gros ce que je souhaite faire, mais de façon à ce que les vignettes rouges avec l'heure, la date et la salle se place d’elles-mêmes sur le tableau.
    Nom : Semaine.png
Affichages : 535
Taille : 42,1 Ko
    Ici j'ai fais un tableau rapide html/css, mais en php je me retrouve avec des lignes de cette taille car je ne sais pas comment créer un tableau a deux dimensions autrement et sachant que les horaires peuvent aussi être du type 8h30 ou 9h45 je devrais en ajouter 3 fois plus .
    Nom : 2019-01-30 16_36_40-C__wamp64_www_tests_Table_Function_Time.php • - Sublime Text (UNREGISTERED).png
Affichages : 369
Taille : 66,6 Ko

    Un petit coups de main serait pas de refus

  2. #2
    Expert confirmé Avatar de CosmoKnacki
    Homme Profil pro
    Justicier interdimensionnel
    Inscrit en
    Mars 2009
    Messages
    3 020
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Charente Maritime (Poitou Charente)

    Informations professionnelles :
    Activité : Justicier interdimensionnel

    Informations forums :
    Inscription : Mars 2009
    Messages : 3 020
    Par défaut
    Un truc comme ça:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    $quarters = range(0, 45, 15);
    $hours = range(8, 18);
    $days = array_fill_keys(['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], null);
     
    $timeSlots = array();
    $format = '%02d:%02d';
     
    foreach ($hours as $hour) {
        foreach ($quarters as $quarter) {
            $timeSlots[sprintf($format, $hour, $quarter)] = $days;
        }
    }
     
    print_r($timeSlots);

  3. #3
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2019
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 28
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2019
    Messages : 13
    Par défaut
    Je suis novice en php (j'ai commencé il y a 3 jours ), mais je vois que le print_r($timeSlots) me donne un tableau constitué de tableaux donc je crois que c'est ce dont j'ai besoin d'après le peu que j'ai vu en php, merci .
    J'aurais encore quelques questions, comment remplir le tableau en fonction de ce que me donne ICS-parser (des datetime) ? et comment le mettre en forme avec HTML ou CSS ?

  4. #4
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2019
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 28
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2019
    Messages : 13
    Par défaut
    Voici mon code pour l'instant je peux ajouter ton code pour le tableau mais après je ne vois pas comment le remplir
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
     
    <?php
    // phpcs:disable Generic.Arrays.DisallowLongArraySyntax.Found
        require_once 'C:\Windows\System32/vendor/autoload.php';
        use ICal\ICal;
        try {
            $ical = new ICal('https://raw.githubusercontent.com/u01jmg3/ics-parser/master/examples/ICal.ics', array(
                'defaultSpan'                 => 2,     // Default value
                'defaultTimeZone'             => 'UTC',
                'defaultWeekStart'            => 'MO',  // Default value
                'disableCharacterReplacement' => false, // Default value
                'filterDaysAfter'             => null,  // Default value
                'filterDaysBefore'            => null,  // Default value
                'replaceWindowsTimeZoneIds'   => false, // Default value
                'skipRecurrence'              => false, // Default value
                'useTimeZoneWithRRules'       => false, // Default value
            ));
            // $ical->initFile('ICal.ics');
            // $ical->initUrl('https://raw.githubusercontent.com/u01jmg3/ics-parser/master/examples/ICal.ics');
        } catch (\Exception $e) {
            die($e);
        }
        $forceTimeZone = false;
        $timehours = date('H:i');
        $mon = date('d-m-Y',time()+( 1 - date('w'))*24*3600);
        $tue = date('d-m-Y',time()+( 2 - date('w'))*24*3600);
        $wed = date('d-m-Y',time()+( 3 - date('w'))*24*3600);
        $thu = date('d-m-Y',time()+( 4 - date('w'))*24*3600);
        $fri = date('d-m-Y',time()+( 5 - date('w'))*24*3600);
        $sat = date('d-m-Y',time()+( 6 - date('w'))*24*3600);
     
    ?>
    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <!-- Latest compiled and minified CSS -->
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
            <link rel="stylesheet" type="text/css" href="testbis_semaine.css">
            <title>PHP ICS Parser test</title>
            <style>body { background-color: #eee } .caption { overflow-x: auto }</style>
        </head>
        <body>
            <div class="container-fluid">
                <?php
                    $showExample = array(
                        'interval' => true,
                        'range'    => true,
                        'all'      => true,
                    );
                ?>
     
                <?php
                    if ($showExample['interval']) {
                        $events = $ical->eventsFromInterval('1 week');
                        if ($events) {
                            echo '<h4>Events in the next 7 days:</h4>';
                        }
                        $count = 1;
                ?>
                    <div class="row">
                    <?php
                    foreach ($events as $event) : ?>
                            <div class="col-md-2">
                                <div class="thumbnail">
                                    <div class="caption">
                                        <h7><?php
                                            $dtstart = $ical->iCalDateToDateTime($event->dtstart_array[3], $forceTimeZone);
                                            echo $event->summary . ' (' . $dtstart->format('d-m-Y H:i') . ') <br>';
                                            $dtend = $ical->iCalDateToDateTime($event->dtend_array[3], $forceTimeZone);
                                            echo $event->summary . ' (' . $dtend->format('d-m-Y H:i') . ')';
                                        ?></h7>
                                    </div>
                                </div>
    							<?php
    								if ($dtstart->format('H:i') <=> $timehours) {
    									$temps[];
     
     
    								}
    							?>
                            </div>
                            <?php
                                if ($count > 1 && $count % 3 === 0) {
                                    echo '</div><div class="row">';
                                }
                                $count++;
                            ?>
                    <?php
                    endforeach
                    ?>
                    </div>
                    <?php } ?>
            </div>
        </body>
    </html>
    Ligne 75 j'ai commencé un if afin d’attribuer une place à chaque grille en fonction du jour et de l'heure mais je ne vois pas comment faire

  5. #5
    Expert confirmé Avatar de CosmoKnacki
    Homme Profil pro
    Justicier interdimensionnel
    Inscrit en
    Mars 2009
    Messages
    3 020
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Charente Maritime (Poitou Charente)

    Informations professionnelles :
    Activité : Justicier interdimensionnel

    Informations forums :
    Inscription : Mars 2009
    Messages : 3 020
    Par défaut
    En fait plus ça va plus je me dis: À quoi bon s'embêter à créer un tableau html avec 240 cases dont les trois-quarts ne serviront à rien, n'apportent rien du point de vue sémantique et ne sont pas spécialement pratiques à remplir? En plus c'est à peine si utiliser un tableau est légitime dés lors qu'on a à faire avec des plages horaires (qui peuvent s'étaler sur plusieurs heures et dont le pas est le quart d'heure). Ça n'a pas de sens à mon avis.

    D'où une autre façon de faire:
    • Coté PHP, tu génères chacune de tes plages horaires au format hCalendar sans te soucier de la disposition, du jour ou de l'heure, genre:
      Code html : Sélectionner tout - Visualiser dans une fenêtre à part
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      <div id="planning" class="vcalendar">
          <section class="vevent">
              <span class="summary">Réunion de service DRH</span>
              de <time class="dtstart" datetime="2019-02-01T08:00">01-02-2019 8h</time>
              à <time class="dtend" datetime="2019-02-01T09:00">01-02-2019 9h</time>
          </section>
          <section class="vevent">
              <span class="summary">Affectation des tickets - DSI</span>
              de <time class="dtstart" datetime="2019-02-04T09:00">04-02-2019 9h</time>
              à <time class="dtend" datetime="2019-02-04T09:30">04-02-2019 9h30</time>
          </section>
          <section class="vevent">
              <span class="summary">Visio Sygal</span>
              de <time class="dtstart" datetime="2019-02-05T13:00">05-02-2019 13h</time>
              à <time class="dtend" datetime="2019-02-05T14:30">05-02-2019 14h30</time>
          </section>
          <!-- etc. -->
      </div>
    • Pour le css: le bloc div avec l'id planning doit être positionné et avoir la taille souhaitée pour ton planning, et, pour avoir l'affichage des heures, des jours et des éléments de la grille, tu créer un svg que tu places en background-image.
    • Toujours coté css: mettre la class vevent en position: absolute et lui donner la largeur souhaitée.
    • Puis tu crées un script Javascript qui va calculer la position (left en fonction du jour et top en fonction de l'heure de début) ainsi que la hauteur de chaque plage-horaire (en fonction de la durée). (Tu peux aussi le faire coté php, mais ça a le désavantage de polluer ton html avec des attributs style.)


    Tu obtiendras un html bien plus léger comme ça, et plus besoin de tableau coté php et html.

  6. #6
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2019
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 28
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2019
    Messages : 13
    Par défaut
    Vendredi j'en suis venu à la même conclusion, donc j'ai simplement créer un tableau html avec en haut les jours et à gauche les heures sans prendre en compte les minutes.
    Maintenant je cherche justement une façon de modifier la hauteur de mes grilles, que l'on voit en rouge sur mon premier post, en fonction de leur durée et modifier leur position en fonction de la date et l'heure pour quelle se place dans le tableau. (Je sais pas si j'ai été clair dans mes explication )
    Je n'ai jamais fais de javascript, si t'as un petit tuto ^^
    Merci pour ton aide

  7. #7
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2019
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 28
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2019
    Messages : 13
    Par défaut
    Petit changement... il me faut une démarcation à chaque quart

  8. #8
    Expert confirmé Avatar de CosmoKnacki
    Homme Profil pro
    Justicier interdimensionnel
    Inscrit en
    Mars 2009
    Messages
    3 020
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Charente Maritime (Poitou Charente)

    Informations professionnelles :
    Activité : Justicier interdimensionnel

    Informations forums :
    Inscription : Mars 2009
    Messages : 3 020
    Par défaut
    Citation Envoyé par Perpelle Voir le message
    j'ai simplement créer un tableau html avec en haut les jours et à gauche les heures sans prendre en compte les minutes.
    Petit changement... il me faut une démarcation à chaque quart
    D'où mon idée de ne pas utiliser le html pour cette partie, mais de la réaliser en svg, que tu places en image de fond de ton bloc, avec lequel tu peux facilement dessiner des lignes et aussi afficher les jours et les heures en abscisse et ordonnée.

    Pour ce qui est du javascript, je ne sais pas trop quoi te conseiller, mais tu devras en trouver des pas trop vieux sur le site. De toute manière ça tient en 10 lignes, la seule difficulté va être de trouver les bons décalages et facteurs pour que tes blocs soient parfaitement calés sur l'image.
    À placer après le body entre balises script:
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    const g = {
        xOffset: 10,
        yOffset: 20,
        xRatio: 10,
        yRatio: 10,
        hRatio: 15
    }
     
    for (const vevent of document.getElementsByClassName('vevent') ) {
        let dtstart = new Date(vevent.getElementsByClassName('dtstart')[0].getAttribute('datetime')),
            dtend = new Date(vevent.getElementsByClassName('dtend')[0].getAttribute('datetime'));
     
        vevent.style.left = `${g.xOffset + (dtstart.getDay() - 1) * g.xRatio}%`;
        vevent.style.top = `${g.yOffset + (dtstart.getHours() + dtstart.getMinutes()/60 - 8) * g.yRatio }%`;
        vevent.style.height = `${(dtend - dtstart)/g.hRatio}%`;
    }

    Il faut donc trouver les bonnes valeurs pour g. (Pour cette délicate opération, je te conseille d'utiliser des événements bidons (un caler le lundi, un caler le samedi, un qui dure toute la journée, deux qui se suivent).

  9. #9
    Membre averti
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2019
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 28
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2019
    Messages : 13
    Par défaut
    Mon svg est terminé j'en avais jamais fais avant, j'ai le même tableau qu'avant mais avec quelque modification.
    Nom : 2019-02-05 10_19_12-Courrier.png
Affichages : 264
Taille : 56,7 Ko
    et voici son code au cas ou:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
     
     <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <!-- Latest compiled and minified CSS -->
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
            <link rel="stylesheet" type="text/css" href="svg.css">
            <title>svg</title>
            <style>body { background-color: #333 } .caption { overflow-x: auto }</style>
        </head>
    	<body>
    		<br>
    		 <svg width="1498" height="700">
    		  <rect class="tableau" width="1498" height="700"/>
    		  <?php
    		  for ($i=700; $i >= 50; $i-=50) { 
    		  	echo '<rect class="heures" width="214" height="'.$i.'"/>';
    		  }
    		  ?>
    		  <?php
    		  for ($i=680, $k=20; $i > 50; $i-=50, $k--) { 
    		  echo '<text class="Theures" x="10" y="'.$i.'">'.$k.'h</text>';
    		  }
    		  ?>
    		  <rect class="jours" x="0" width="214" height="50"/>
    		  <text class="Theures" x="164" y="20">Jours</text>
    		  <text class="Theures" x="10" y="40">Heures</text>
    		  <line class="ligne" x1="0" y1="1" x2="214" y2="49"/>
    		  <rect class="jours" x="214" width="214" height="50"/>
    		  <text class="Theures" x="224" y="30">Lundi</text>
    		  <rect class="jours" x="428" width="214" height="50"/>
    		  <text class="Theures" x="438" y="30">Mardi</text>
    		  <rect class="jours" x="642" width="214" height="50"/>
    		  <text class="Theures" x="662" y="30">Mercredi</text>
    		  <rect class="jours" x="856" width="214" height="50"/>
    		  <text class="Theures" x="866" y="30">Jeudi</text>
    		  <rect class="jours" x="1070" width="214" height="50"/>
    		  <text class="Theures" x="1080" y="30">Vendredi</text>
    		  <rect class="jours" x="1284" width="214" height="50"/>
    		  <text class="Theures" x="1294" y="30">Samedi</text>
    		  <?php
    		  for ($i=50; $i < 700; $i+=12.5) {
    		  	echo '<line class="lignes" x1="214" y1="'.$i.'" x2="1498" y2="'.$i.'"/>';
    		  }
    		  ?>
    		</svg> 
     
    	</body>
    </html>
    Tu avais raison c'est bien plus rapide surtout pour les lignes
    Maintenant je vais essayer d’intégrer le js.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 2
    Dernier message: 13/05/2016, 20h23
  2. remplir un tableau à deux dimensions depuis une base de donnée
    Par abbescr7 dans le forum Collection et Stream
    Réponses: 8
    Dernier message: 13/05/2016, 14h25
  3. Réponses: 1
    Dernier message: 14/04/2010, 17h13
  4. Comment créer et parcourir un tableau à deux dimensions en java SE
    Par Invité dans le forum Collection et Stream
    Réponses: 2
    Dernier message: 25/02/2009, 11h07
  5. Réponses: 27
    Dernier message: 19/04/2006, 17h58

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo