[Résolu] Isométrie avec tuiles carrées

[Résolu] Isométrie avec tuiles carrées - Version imprimable

+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [Résolu] Isométrie avec tuiles carrées (/showthread.php?tid=3455)

Pages : 1 2 3

[Résolu] Isométrie avec tuiles carrées - horexas - 18-12-2008

Salut. Pour le moment j'utilise la cartou de carlou pour faire fonctionner mon script cependant je voudrais la modifier pour qu'elle soit en 3d isométrique. Que dois-je faire apres avoir divisé la hauteur des tuiles par deux et les avoir fait tourné de 45degrés.
-Puis-je je garder 'la methode tableau':

Code PHP :
<?php 

echo '<table border="1" cellspacing="0" cellpadding="0">'."\n";

echo '<tbody>'."\n";

for ($y=$y_debut;$y<=$y_fin;$y++) 

{

   echo'<tr >';

       for($x=$x_debut;$x<=$x_fin;$x++)

       {

       echo '<td> ... </td>';

       }                            

   echo'</tr>;

}

echo '</tbody></table>';

RE: Isométrie avec tuiles carrées. - Zack - 18-12-2008

N'utilise pas les tableau mais plutôt les divs pour les tuiles isométrique.

Dans ton cas, pour les tuiles carrées, je ferais quelque chose de ce genre là :

Code PHP :
<?php 

for ($y=$y_debut;$y<=$y_fin;$y++) 

{

       for($x=$x_debut;$x<=$x_fin;$x++)

       {

       $iX = ($x-$y) * (largeur de ta tuile);

       $iY = (($x+$y)/2) * (largeur de ta tuile);

        //Affichage de la div des terrain.

       echo  '<div style="top:'.$iY.'px; left:'.$iX.'px; position:absolute; background-image: url(\'image du terrain\');">';

       }                            

}

RE: Isométrie avec tuiles carrées. - horexas - 18-12-2008

Merci beaucoup j'ai juste un dernier petit probleme: les cases ont la bonne position mais ne s'imbriquent pas ( voir --> ici <--)

RE: Isométrie avec tuiles carrées. - jo_link_noir - 18-12-2008

Diviser iX et iY par 2 ?

RE: Isométrie avec tuiles carrées. - Zack - 18-12-2008

Variez la largeur de la tuile jusqu'à ce qu'elles se touchent. Ou oué en divisant par 2, ca le fait.

RE: Isométrie avec tuiles carrées. - horexas - 19-12-2008

Merci cela fonctionne le probleme c'est que la carte se déplace sur ma page en fonction de mes déplacement voila mon script:je crois que c'est du au $iX et $iY car lorsque $x et $y prend d'autre valeurs lorsque je me déplace (ex : $x qui etait compris entre 1 et 6 passe entre 3 et 8) cela modifie la postion en px de la carte, que dois je faire? Soustraire une valeur qui augmente en focntion de $x a la position de l'image?? Si oui comment? Merci

Code PHP :
<?php 

for ($y=$y_fin;$y>=$y_debut;$y--) {

for($x=$x_debut;$x<=$x_fin;$x++) {    

      $iX = (($x-$y) * (55));

      $iY = ((($x+$y)/2) * (55));

      echo '<div style=" position: absolute; left: 250px; top: 200px; "><img src="" alt="carre" style="top:'.$iY.'px; left:'.$iX.'px; position:absolute;"/></div>';

}

}

RE: Isométrie avec tuiles carrées. - Zack - 19-12-2008

En effet, ca pose problème.
En fait, faut pas reprendre le x et y qui sort. Mais repartir sur un x et y égale à 0 que tu incrémentes. Un exemple car je suis nul en explication :

Code PHP :
<?php 

for ($y=$y_fin;$y>=$y_debut;$y--) {

$Yi = 0;

      for($x=$x_debut;$x<=$x_fin;$x++) {    

      $Xi = 0;

      $iX = (($Xi-$Yi) * (55));

      $iY = ((($Xi+$Yi)/2) * (55));

      echo '<div style=" position: absolute; left: 250px; top: 200px; "><img src="" alt="carre" style="top:'.$iY.'px; left:'.$iX.'px; position:absolute;"/></div>';

      $Xi++;

      }

$Yi++;

}

RE: Isométrie avec tuiles carrées. - horexas - 19-12-2008

Merci zack ma carte ne bouge plus mais il n'y a plus qu'un seul carré !!! Pourquoi l'informatique ca bug tout le temp^^

Code PHP :
<?php 

for ($y=$y_fin;$y>=$y_debut;$y--) 

{

     $Yi = 7;

 for($x=$x_debut;$x<=$x_fin;$x++) 

    {

    $sql_2 = mysql_query('SELECT pseudo FROM membre WHERE posx='.$x.' and posy='.$y.' ') or die(mysql_error());

    $donnees = mysql_fetch_array($sql_2);    

    $Xi = 0;

    $iX = (($Xi-$Yi) * (55));

    $iY = ((($Xi+$Yi)/2) * (55));

          if($x==$posx && $y==$posy)

          echo '<div style=" position: absolute; left: 400px; top: 400px; "><a href="http://wouww.les-terres-d-agraec.webou.net/jeur.php?posx='.$x.'&amp;posy='.$y.'" class="info"><img src="http://img376.imageshack.us/img376/1082/isosr4.png" alt="carré" style="top:'.$iY.'px; left:'.$iX.'px; position:absolute;"/><span>Joueur:'.$donnees['pseudo'].'</span></a></div>';

          else

          if(!empty($TabMAP[$x][$y]))

          echo '<div style=" position: absolute; left: 400px; top: 400px; "><a href="http://www.les-terres-d-agraec.webou.net/joueur.php?posx='.$x.'&amp;posy='.$y.'" class="info"><img src="http://img376.imageshack.us/img376/9562/isosp1.png" alt="carré" style="top:'.$iY.'px; left:'.$iX.'px; position:absolute;"/><span>Joueur:'.$donnees['pseudo'].'</span></a></div>';

          else

          echo '<div style=" position: absolute; left: 400px; top: 400px; "><img src="http://img386.imageshack.us/img386/8008/isooy0.png" alt="carré" style="top:'.$iY.'px; left:'.$iX.'px; position:absolute;"/></div>';

     $Xi++; 

    }

$Yi--;

}

RE: Isométrie avec tuiles carrées. - Anthor - 19-12-2008

En prenant le temps d'avoir un minimum de réflexion ?

L'assistanat n'est pas une solution.

RE: Isométrie avec tuiles carrées. - horexas - 19-12-2008

Merci a tous ( surtout zack ) je vais chercher et je vous dirai quoi...