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


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

Code PHP :
<?php 
//taille de l'image
$L2=72;
//Largeur de la partie noir de l'image d'OncleJames
$L1 = sqrt(3)/4*$L2;

Code PHP :
<?php 
$X
= ($x+1)*($L2 - ($L1+5)/2); //le numéro 5 pour le décalage
$Y = $y*($L1 + 4); //le numéro 4 pour le décalage
//Il y a un décalage car ton hexagone n'est pas parfait :/

if($x%2 == 0) { //Pair
$Y += $L2/2;
}

J'ai tester et ça marche, mais j'ai une question, y a toujours un décalage de 2y entre chaque colonne ?


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

Allez, la bonne vieille méthode de bourrin, voilà le script actuel :

Code PHP :
<?php 
$sql
= mysql_query("SELECT x,y,vision FROM membres WHERE id='".$_SESSION['id_joueur']."'"); //Récupération des données du personnage
$perso = mysql_fetch_array($sql);
$sql = mysql_query("SELECT * FROM carte WHERE x='".$perso['x']."' AND y='".$perso['y']."'"); //Récupération des données du terrain
$terrain = mysql_fetch_array($sql);

// On définit le tableau en fonction de la vision
$x_min = $perso['x']-$perso['vision'];
$x_max = $perso['x']+$perso['vision'];
$y_min = $perso['y']-$perso['vision'];
$y_max= $perso['y']+$perso['vision'];

echo
$x_min.$x_max.$y_min.$y_max;
// On récupère les données 'joueurs' des environs
$result = mysql_query("SELECT id,x,y FROM membres WHERE x BETWEEN '$x_min' AND '$x_max' AND y BETWEEN '$y_min' AND '$y_max'") or die(mysql_error());

// On va stocké les info de chaque joueur dans un array
while ( $data = mysql_fetch_array($result)) {
$joueur[$data['x']][$data['y']] = array('x'=>$data['x'],'y'=>$data['y'],'id'=>$data['id']);
}

$width=72; // Largeur de l'image des terrains qui permettra de décaler les images
$curent_y = -5000;

// Petit calcul pour ne pas déformer la map selon le y de base/référence lors de la génération
if ($y_min%2 == 0) {
$y = 0;
}else {
$y = 1; }

$query = mysql_query("SELECT x,y,id_terrain FROM carte WHERE x BETWEEN '$x_min' AND '$x_max' AND y BETWEEN '$y_min' AND '$y_max' ORDER BY y,x");

// On génére la map
while($carte = mysql_fetch_array($query)) {
if (
$curent_y!=$carte['y']) { // Nouvelle ligne
$x=0;
$y++;
$curent_y = $carte['y'];
}
$x++;

//taille de l'image
$L2=72;
//Largeur de la partie noir de l'image d'OncleJames
$L1 = sqrt(3)/4*$L2;

$X = ($x+1)*($L2 - ($L1+5)/2); //le numéro 5 pour le décalage
$Y = $y*($L1 + 4); //le numéro 4 pour le décalage
//Il y a un décalage car ton hexagone n'est pas parfait :/

if($x%2 == 0) { //Pair
$Y += $L2/2;
}

$var_carte .= '<div class="case" style="top:'.$Y.'px;left:'.$X.'px;';
$var_carte .= 'background-image: url(\'terrain/'.$carte['id_terrain'].'.png\');">';


$var_carte .= "<br />$x/$y";


if ( isset(
$joueur[$carte['x']][$carte['y']])) {
// la prescence d'un joueur est détecté sur cette case
$var_carte .= "<br />ici";
}

$var_carte .= '</div>';

}
// fin While

echo $var_carte;


Avec ceci les images sont alignées verticalement en se superposant un peu (voir le résultat si vous voulez sur mon site, quelques post avant).


Pour le moment, mon seul souci est l'alignement des tuiles, je ne me suis pas occupé de tout ce qui reste dans le script Wink


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

Hmm ça sent bon les textures wesnoth ^^. Je n'ai aucun de mes essais ici, mais les textures telles quelles se calent parfaitement en 2D.


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

Ouep, plus de graphiste, marre de rpg maker => Wesnoth ^^

En 2D ? Oui, c'est de la 2D, suffit de trouver l'algo qui les cale bien Wink


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

Là j'ai pas trop le temps de chercher, alors je te passe ce que j'ai fait.
Par contre j'avance les y 2 par 2, je sais pas si c'est bon :/

$L2=72; //taille de l'image
$L1 = sqrt(3)/4*$L2;
for($x=0; $x<10; $x++)
{
for($y=0; $y<10; $y+=2)
{
$X = ($x+1)*($L2 - ($L1+5)/2); //le numero 5 pour le decalage
$Y = $y*($L1 + 4); //le numero 4 pour le decalage
//decalage car hexagone non regulier

if($x%2 == 0) { //Pair
$Y += $L2/2;
}

echo '<img src="_img/1.png" style="position:absolute;left:'.$X.'px;top:'.$Y.'px;"/>';
}
}



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

Ton algorythme est nickel, les tuiles se calent parfaitement, j'ai commencé à l'adapter et c'est vraiment pas mal Wink

Mais tu peux m'expliquer pourquoi tu avances les y 2 par 2? Cela fait qu'il n'y a plus de case comme 1/1, 1/3, 1/5 etc....

KassaK, qui essaye de comprendre...


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

En fait, je savais pas comment tu gérés les y, alors j'ai fait par rapport à l'image d'OncleJames, et y a pas les 1/2, 1/4, etc.

si je ne me trompe pas, tu fait $Y = 2*$y*($L1 + 4); et c'est bon


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

Nop pas bon :p

Pour l'info, j'essaye depuis 1h.... ~~~~>[]


RE: Tuto Wiki map hexagonale - jo_link_noir - 23-12-2008

Ah ? C'est bizarre, quand j'essaye sur ce que je t'ai passer, ça fonctionne (en remplaçant aussi y+=2 par y++).