JeuWeb - Crée ton jeu par navigateur
Tuto Wiki map hexagonale - 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 : Tuto Wiki map hexagonale (/showthread.php?tid=3465)

Pages : 1 2

Tuto Wiki map hexagonale - Kassak - 21-12-2008

Je suis en train de regarder le tuto du wiki : Carte Hexagonale.

Savez vous qui est l'auteur ? Il y a plein d'erreurs, faciles à corriger mais quand même, je vais corriger ça quand j'en aurais fini avec ma map.

Donc, mou mes tuiles ont cette forme la :

[Image: 1.png]

Le petit bout de script dans ce tuto qui permet d'emboiter les tuiles est celui ci :

Code PHP :
<?php 

// Calcul pour savoir si on décale ou pas les cases d'une ligne

    if ( ($y%2) == 1) { // Pair

        $iX=($x*80)-40;

    }else {

         $iX= ($x*80) + ($width/2)-40;

    }

    $iY = ($y*60 )-80;

Je n'y comprends donc rien à ce bout de code, mes tuiles n'ayant pas la même forme que celle du tuto, je ne sais pas comment modifier ceci pour pouvoir bien empiler les miennes..si quelqu'un peut m'éclairer?

Si vous voulez voir ce que ça fait :

Allez ici
Login :test
MDP : testage1


Merci.

RE: Tuto Wiki map hexagonale - Ruz - 21-12-2008

(21-12-2008, 04:39 PM)Kassak a écrit : Je suis en train de regarder le tuto du wiki : Carte Hexagonale.

Savez vous qui est l'auteur ? Il y a plein d'erreurs, faciles à corriger mais quand même, je vais corriger ça quand j'en aurais fini avec ma map.

Donc, mou mes tuiles ont cette forme la :

[Image: 1.png]

Le petit bout de script dans ce tuto qui permet d'emboiter les tuiles est celui ci :

Code PHP :
<?php 

// Calcul pour savoir si on décale ou pas les cases d'une ligne

    if ( ($y%2) == 1) { // Pair

        $iX=($x*80)-40;

    }else {

         $iX= ($x*80) + ($width/2)-40;

    }

    $iY = ($y*60 )-80;

Je n'y comprends donc rien à ce bout de code, mes tuiles n'ayant pas la même forme que celle du tuto, je ne sais pas comment modifier ceci pour pouvoir bien empiler les miennes..si quelqu'un peut m'éclairer?

Si vous voulez voir ce que ça fait :

Allez ici
Login :test
MDP : testage1


Merci.

Bah, euh, la mienne, c'est de l'hexa isométrique... donc, j'ai des modifs encore en plus, mais vais tenter de t'aider.

Code PHP :
<?php 

// Calcul pour savoir si on décale ou pas les cases d'une ligne

    if ( ($y%2) == 1) { // Pair

        $iX=($x*80)-40;

    }else {

         $iX= ($x*80) + ($width/2)-40;

    }

    $iY = ($y*60 )-80;
Ce bout de code t'explique que les cases ayant une coordonnée Y impair sont décalées d'une demi-largeur sur l'axe X. (le -40, je vois pas à priori, surement un réglage pour s'aligner avec Y)
Tes tuiles font-elles 80*80??? (edit: bah, non, c'est 72*72)... commence pitet par régler ca...
A la louche, ca ferait pitet bien ca, pour les tiennes: (pas testé)
Code PHP :
<?php 

// Calcul pour savoir si on décale ou pas les cases d'une ligne

    if ( ($y%2) == 1) { // Pair

        $iX=($x*72)-36;

    }else {

         $iX= ($x*72) + ($width/2)-36;

    }

    $iY = ($y*54)-36;

Essaye et dis moi quoi ^^ (note, je tiens pas compte de la forme des tuiles, et j'ai pas été vérifier celles de base).

RE: Tuto Wiki map hexagonale - Kassak - 21-12-2008

J'ai déjà essayé ça Ruz, et non ça ne marche pas non plus Wink

RE: Tuto Wiki map hexagonale - Ter Rowan - 21-12-2008

y a deux différences

la taille des tuiles donc prends 72 et 36 si tes tuiles font 72 (comme a dit Ruz)
la position des sommets, la pointe est chez toi horizontale alors que dans le tuto elle est verticale.

essaie d'inverser les x et les y , ça doit certainement aider un peu

RE: Tuto Wiki map hexagonale - OncleJames - 21-12-2008

Bonsoir,

C'est .. moi l'auteur :$ mais il date d'environs deux ans; maintenant l'algorithme est totalement différent.

Code PHP :
<?php 

// Calcul pour savoir si on décale ou pas les cases d'une ligne

    if ( ($y%2) == 1) { // Pair

        $iX=($x*80)-40;

    }else {

         $iX= ($x*80) + ($width/2)-40;

    }

    $iY = ($y*60 )-80;

En faite on va décaler plus ou moins à droite afin d'ajuster les cases, si tu regardes les y sur une colonne ils sont croissant de 1.
Tout les Y pair sont décalés exactement de -40 px
Tout les Y impair sont décalés exactement de -80 px
Ce bout de code sert à placer correctement les hexagones. (alignement)

La taille des images du tuto de tête étaient de 80*80px, pour trouver ces valeurs, c'était un peu ... au pif.

Je travaille actuellement sur un système plus complexe de gestion de case, qui selon les terrains voisins, va tourner et compléter les images pour donner un réel effet.
Mais il me reste encore quelques nuits blanches dessus avant de trouver, noël approchant c'est pas pour tout de suite.

Si tu as des questions n'hésite pas Wink

Onclejames

RE: Tuto Wiki map hexagonale - Kassak - 21-12-2008

Oui une question, comment adapter ce bout de script à mes tuiles^^

Je dois dire qu'à chaque fois j'essaye en me disant "mais oui jsuis bête c'est comme ça", et en faites non....et vu que tu me dis que tu as trouvé ça au pif ?

Mon seul souci c'est l'alignement des tuiles, tout le reste c'est pas de problème Wink

RE: Tuto Wiki map hexagonale - OncleJames - 21-12-2008

J'ai regardé un peu ton système mais il manque une donnée pour l'algorithme, comment tu disposes tes X, j'ai fais le schéma sur papier et il y a deux possibilités, il me faut savoir laquelle tu utilises.

Peut tu me faire un schéma rapide sur paint (sa suffit) avec une dizaine de case numéroté X/Y.

OncleJames

RE: Tuto Wiki map hexagonale - Kassak - 22-12-2008

Je n'en utilise pas en faites, j'ai pas réfléchi à ça, les maths de ce genre ça me prend la tête !

Fait la plus simple qui te vient à l'esprit, et merci d'avance c'est cool Wink

RE: Tuto Wiki map hexagonale - OncleJames - 22-12-2008

Le plus simple est de partir sur la numérotation suivante :

[Image: aide_hexa.PNG_u1229897794.png]

Il manque une longueur sur mon schéma : L3 on va l'appeler qui correspond à l'espace en fin de L2 jusqu'au bord de l'image.

Elle est un peu spécial mais simplifie grandement l'algorithme, tout les x sont répétés avec la même longueur :

Code PHP :
<?php 

if ( ($x%2) == 0) { //ImpPair

     $iX = ($x*$L2) + $L1;

 } else {

     $iX = ($x*$L2) - $L3;

 }

Et pareil pour les y : ($H1 = height/2)

Code PHP :
<?php 

$iY = ($y*$H1);


Le mieux c'est d'essayer pas à pas, la logique de création d'une carte n'est pas évidente, reprendre en copiant collant le code n'est pas une bonne idée.
Je travaille actuellement sur ce type de carte (coordonnée), je mettrai un tutoriel quand j'aurais finit, car le système est plus complexe.

Il faut savoir qu'il n'existe pas non plus, l'algorithme secret, il en existe tout plein qui marche !

Si tu souhaites tout de même conserver ton repère, il faut juste changer les valeurs et trouver les bonnes, mais avant tout ça il est obligatoire de passer par l'étape brouillon/papier :glace: (sa aide énormément)

RE: Tuto Wiki map hexagonale - Kassak - 22-12-2008

Le bout de code que tu as noté est censé donner un bon résultat ? (car ce n'est pas le cas)

Je ne comprends pas ce que représente L3, si tu peux préciser.

Et même si aujourd'hui je ne trouve plus de réels difficultés lorsque je programme (j'arrive toujours à mes fins), pour moi ce genre de script c'est vraiment le bordel, car ce n'est pas de la programmation, mais des mathématiques...on est bon ou pas, moi c'est plus vers le ou pas !

Edit : Et que viens faire le $curent_y = -5000; dans ce script ? Il sert à quoi? ^^