+- 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 : Disposition des tuiles hexagonales sur une carte (/showthread.php?tid=3025)
RE: Disposition des tuiles hexagonales sur une carte - Harparine - 08-09-2008
Ter Rowan a écrit :et surtout... dans la suite logique.. l'aspect "fusion d'hexagone" (je ne sais pas comment dire)
prenons l'image que tu as présenté, on voit clairement que chaque "bosquet" tient dans un hexagone, on n'a pas l'impression d'une "masse" qui ressemblerait à une forêt recouvrant plusieurs hexagones
c'est aussi un gros boulot mais.. est ce du graphisme ( je construis l'image pour donner une sorte de répétion multituile), est ce de l'algorithme (je construis l'image en fonction des cases voisines)
plus troublant encore, la gestion des cours d'eau plus petit que l'hexagone.... comment on fait ? les directions, etc...
enfin, c'est un gros chantier si on veut faire quelque chose de bien
A la différence de Sephi, je dirais que c'est les deux. En effet, j'ai bossé sur ce système (à la manière de l'éditeur de Warcraft 2) et je me suis fait un éditeur de cartes en Flash pour mon jeu. En réalité, il te faut 9 sprites différents en fonction des cases adjacentes et il faut surtout un gros aspect algorithme qui permet de choisir l'image appropriée. Dans les faits, c'est juste une série de tests imbriqués ou bien un switch : on récupère le type et cases d'à côté et on élimine les images possibles (ex : si à côté c'est de la forêt, je "colle" donc je ne prendrai pas une case qui termine une zone, etc.).
Les rivières, c'est le même principe mais il faut créer plus d'images.
Enfin, pour revenir à la question des multi-couches, Sephi, les possibilités sont effectivement énormes mais la limite est la puissance de l'ordinateur client : les trop grandes cartes sont à proscrire car elles mettent du temps à s'afficher (c'est la raison pour laquelle j'ai fini par choisir le Flash).
De manière générale, il vaut mieux faire les cartes les plus légères possibles, avec le moins de tuiles possibles. L'idéal est donc de créer une seule image de décor avec GD pour la zone jeu (et garder une carte dynamique avec des tuiles pour l'éditeur).
@+
RE: Disposition des tuiles hexagonales sur une carte - Harparine - 08-09-2008
Sephi-Chan a écrit :Harparine, l'empilement des couches en soi n'est pas un problème. Mon souci est de permettre à l'image de fond d'une tuile de chevaucher la tuile de derrière. Je n'arrive vraiment pas à le faire.
Désolé mais je ne comprends pas bien ce que tu entends par "chevaucher" et image de fond...:heuuu:
RE: Disposition des tuiles hexagonales sur une carte - Zamentur - 08-09-2008
Je ne pense pas que ce soit si complexe il suffit de créer un objet tuile, qui regarde ses objets voisins et détermine donc l'image à utiliser en fonction des 6 faces...
Ensuite au lieu de placer une image, on place l'objet et le reste sera fait.
La seul vrai difficulté est graphique puisqu'il faut dessiner chaque cas possible...
RE: Disposition des tuiles hexagonales sur une carte - Sephi-Chan - 08-09-2008
Harparine a écrit :Je pense que cette image t'aidera à comprendre :Sephi-Chan a écrit :Harparine, l'empilement des couches en soi n'est pas un problème. Mon souci est de permettre à l'image de fond d'une tuile de chevaucher la tuile de derrière. Je n'arrive vraiment pas à le faire.
Désolé mais je ne comprends pas bien ce que tu entends par "chevaucher" et image de fond...:heuuu:
![[Image: exemple_u1220870710.png]](http://upload.jeuweb.org/uploaded/exemple_u1220870710.png)
Comme tu peux le voir, les sapins dépassent de leur tuile et chevauchent donc l'image de la tuile précédente. Je n'arrive pas à faire cela avec mon script, la tuile garde la même taille et le bas de l'image est tronqué.
Ta solution ne me semble pas envisageable Zamentur, cela nécessiterai une trop grande quantité (déjà énorme) d'images, et les tests pour connaître les cases aux alentours se révéleront coûteux sur un si grand nombre de cases.
Sephi-Chan
RE: Disposition des tuiles hexagonales sur une carte - Harparine - 08-09-2008
Ah ok, pour faire dépasser, je calculerais la différence de hauteur entre une tuile normale et une tuile avec arbres (par exemple 20px), et je décalerais d'autant la tuile vers le haut. Par contre, je ne connais pas la nature des images que tu utilises ni la structure de ton code. Pour que cela fonctionne, il faut :
- des images avec transparence (gif ou png)
- une structure html à base de div placées en absolute (pas de tableau)
- des classes CSS différentes en fonction des div (ex : class="base", class="foret") pour adapter la taille de la div à l'image contenue dedans).
Si tu ne vois pas comment faire, poste ton code
Enfin, pour le coup des zones "continues", j'ai utilisé le même principe que Zamentur (9 tuiles pour une base carrée). Effectivement, les tests sont très lourds mais normalement, ils ne sont effectués que sur l'éditeur de cartes. Car on peut générer une image fixe ou bien enregistrer la bonne image dans le fichier carte (j'utilise cette dernière solution).
@+
RE: Disposition des tuiles hexagonales sur une carte - Anthor - 08-09-2008
Je vais essayer de mieux m'exprimer que cet après-midi avec Sephi au sujet des positionnements des blocs.
![[Image: maquette:carte-html.jpg]](http://wiki.noname-game.net/_media/maquette:carte-html.jpg)
J'espère que ça aidera a mieux comprendre le positionnement des blocs dans le bloc contenant la carte.
RE: Disposition des tuiles hexagonales sur une carte - Ter Rowan - 08-09-2008
Harparine, je ne comprends pas l'utilisation du css ( pour les diverses classes) tu peux expliciter ?
à mon sens on positionne directement dans le html les positions (c'est autant une information que de " l'aspect" ) du coup, pourquoi les classes ? Quelles autres informations apportes tu via le css ?
RE: Disposition des tuiles hexagonales sur une carte - Sephi-Chan - 08-09-2008
Pour ma part, j'opte généralement pour une création d'un fichier CSS à la volée et qu'on ne change plus ensuite.
Par exemple, quand je clique sur valider dans mon éditeur de map, ça me crée un fichier de ce genre :
Code :
.tile_0_0 {
top : 0;
left : 0;
}
.tile_1_0 {
top : 0;
left : 80px;
}Ensuite, à la génération du code HTML, je ne produits pas un code source gigantesque, je fais juste :
Code PHP :
<?php
<div class="tile <?php echo 'tile_'.$x.'_'.$y; ?>"><!-- … --></div>
Cela me permet une économie conséquente en terme d'interprétation : les calculs de positions ne sont effectués que lorsque la carte change. Le CSS est mis en cache par le navigateur. Le code source (HTML) en ressort bien plus léger. Il n'y a que des avantages pour le temps de chargement.
Je précise que c'est n'est qu'une ébauche, la version simple de mon système. Ça peut largement être complexifié.
Sephi-Chan
RE: Disposition des tuiles hexagonales sur une carte - Harparine - 08-09-2008
Ter Rowan, j'explique tout ça demain (je me lève tôt, je vais me coucher, là), pour les class mais mon système est proche de celui de Sephi (sauf que je ne génère pas de CSS à la volée).
Par contre, le principe de la génération de CSS est excellent. Je pense que je l'utiliserai moi aussi (avec toutes les discussions qu'il y a eu sur les cartes, on pourrait maintenant faire le tuto ultime ! -> mais faut du temps^^).
Anthor, ta carte est superbe ! Bonne nuit
RE: Disposition des tuiles hexagonales sur une carte - Ter Rowan - 08-09-2008
au début, je suis parti la dessus mais je me suis dit qu'entre :
<div class="x y"> + css (x y)
et
<div style="x y">
ça revenait à peu près au même (évidemment je force le trait avec mon "x y" ^^) voir plus à cause du css. D'autant que ça me permet d'avoir une carte du diamètre que je veux (contrairement au css qui nécessite de définir l'ensemble des positions)
en fait l'autre solution qui m'attirait était de ne pas passer par des tuiles mais par un fond de carte (à la mappy) plus sexy
je me demande si le rapport qualité / charge est positif