begin process at 2010 03 22 01:13:28
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Trucs & Astuces

 > REMPLIR UN TABLEAU EN SPIRALE

REMPLIR UN TABLEAU EN SPIRALE


 Information sur la source

Note :
9 / 10 - par 1 personne
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Trucs & Astuces Classé sous :remplir, tableau, spirale, agorithme Niveau :Débutant Date de création :24/11/2007 Date de mise à jour :24/11/2007 21:53:35 Vu :6 388

Auteur : nickadele

Ecrire un message privé
Site perso
Ce membre participe au partage de revenus publicitaires
Commentaire sur cette source (3)
Ajouter un commentaire et/ou une note


 Description

Suite à un post (http://www.javascriptfr.com/infomsg_TABLEAU-SPIRA LE_1039112.aspx ), je me suis penché sur la question du remplissage d'un tableau en spirale :
Imaginons donc un carré de 5*5, cela devrait donner ceci en résultat finale
0  1  2  3  4
15 16 17 18 5
14 23 24 19 6
13 22 21 20 7
12 11 10 9  8

Source

  • <script language="javascript">
  • <!--
  • tableauspirale(5);
  • function tableauspirale(vartaille){
  • if (vartaille>1){
  • var taille=parseInt(vartaille);
  • var nbr=0;
  • var damier=new Array(taille);
  • var nbrcarre = parseInt(taille / 2);
  • //initialisation du damier
  • for (var j=0;j<damier.length;j++){damier[j]= new Array(damier.length);}
  • for (var j=0;j<damier.length;j++)
  • {
  • for (var x=0;x<damier[j].length;x++){damier[j][x]=0;}
  • }
  • //initialisation des limites
  • var premiereligne=0;
  • var dernierecolonne=taille -1 ;
  • var derniereligne=taille - 1;
  • var premierecolonne=0;
  • for(var startcarre=1;startcarre<nbrcarre+1;startcarre++){
  • //construction de la première ligne
  • for(var j=premiereligne;j<dernierecolonne;j++)
  • {
  • damier[premiereligne][j]=nbr;
  • nbr++;
  • }
  • //affichage
  • affichagetableau(damier);
  • //construction de la dernière colonne
  • for(var j=premiereligne;j<derniereligne;j++)
  • {
  • damier[j][dernierecolonne]=nbr;
  • nbr++;
  • }
  • //affichage
  • affichagetableau(damier);
  • //construction de la dernière ligne
  • for(var j=dernierecolonne;j>premierecolonne;j--)
  • {
  • damier[derniereligne][j]=nbr;
  • nbr++;
  • }
  • //affichage
  • affichagetableau(damier);
  • //construction de la première colonne
  • for(var j=derniereligne;j>premiereligne;j--)
  • {
  • damier[j][premierecolonne]=nbr;
  • nbr++;
  • }
  • //affichage
  • affichagetableau(damier);
  • //incrementation pour donner les limites du carre suivant
  • premiereligne += 1;
  • dernierecolonne -= 1;
  • derniereligne -= 1;
  • premierecolonne += 1;
  • }
  • //si la taille du carré est un nombre impaire alors on remplit le centre du tableau avec la dernière valeur de nbr
  • if (taille%2){
  • damier[premiereligne][premiereligne]=nbr;
  • //affichage
  • affichagetableau(damier);
  • }
  • }
  • }
  • function affichagetableau(damier){
  • //affichage
  • document.write("<table>");
  • for (var j=0;j<damier.length;j++){
  • document.write("<tr>");
  • for (var x=0;x<damier[j].length;x++){
  • document.write("<td>");
  • document.write(damier[j][x]);
  • document.write("</td>");
  • }
  • document.write("</tr>");
  • }
  • document.write("</table>");
  • document.write("<br>");
  • }
  • //-->
  • </script>
<script language="javascript"> 
<!--
tableauspirale(5);
function tableauspirale(vartaille){
	if (vartaille>1){
		var taille=parseInt(vartaille);       
		var nbr=0;
		var damier=new Array(taille);
		var nbrcarre = parseInt(taille / 2);
		//initialisation du damier
		for (var j=0;j<damier.length;j++){damier[j]= new Array(damier.length);}
		for (var j=0;j<damier.length;j++)
			{
			for (var x=0;x<damier[j].length;x++){damier[j][x]=0;}
			}
		//initialisation des limites
		var premiereligne=0;
		var dernierecolonne=taille -1 ;
		var derniereligne=taille - 1;
		var premierecolonne=0;
		for(var startcarre=1;startcarre<nbrcarre+1;startcarre++){
			//construction de la première ligne
			for(var j=premiereligne;j<dernierecolonne;j++)
				{
				damier[premiereligne][j]=nbr;
				nbr++;
				}
			//affichage
			affichagetableau(damier);
			//construction de la dernière colonne
			for(var j=premiereligne;j<derniereligne;j++)
				{
				damier[j][dernierecolonne]=nbr;
				nbr++;
				}
			//affichage
			affichagetableau(damier);
			//construction de la dernière ligne
			for(var j=dernierecolonne;j>premierecolonne;j--)
				{
				damier[derniereligne][j]=nbr;
				nbr++;
				}
			//affichage
			affichagetableau(damier);
			//construction de la première colonne
			for(var j=derniereligne;j>premiereligne;j--)
				{
				damier[j][premierecolonne]=nbr;
				nbr++;
				}
			//affichage
			affichagetableau(damier);
			//incrementation pour donner les limites du carre suivant
			premiereligne += 1;
			dernierecolonne -= 1;
			derniereligne -= 1;
			premierecolonne += 1;
		}
		//si la taille du carré est un nombre impaire alors on remplit le centre du tableau avec la dernière valeur de nbr
		if (taille%2){
			damier[premiereligne][premiereligne]=nbr;
			//affichage
			affichagetableau(damier);
		}
		
	}
}
function affichagetableau(damier){
	//affichage
	document.write("<table>");
	for (var j=0;j<damier.length;j++){
		document.write("<tr>");
		for (var x=0;x<damier[j].length;x++){
			document.write("<td>");
			document.write(damier[j][x]);
			document.write("</td>");
			}
		document.write("</tr>");
		}
	document.write("</table>");
	document.write("<br>");
}
//-->
</script>

 Conclusion

Code à placer dans le body.
J'ai placé la fonction d'affichage du tableau tout au long du procédé pour que vous puissiez voir les différentes étapes de construction !
Attention évitez les grandes tailles de carré si vous laissez l'affichage actif.


 Sources du même auteur

Source avec Zip Source avec une capture DOM PARCOURIR LES RÉPERTOIRES ET FICHIERS EN LOCAL (EXCLUSIF...
Source avec Zip SELECT >> DIV >> LE PROBLÈME DANS IE, COMMENT LE RÉSOUDRE

 Sources de la même categorie

HTML_ENTITIES_DECODE par zen69
ACCÈS À LA MÉTHODE SETATTRIBUTE('STYLE','') SOUS IE6 par masternico
OUTIL DE SÉLECTION par jdmcreator
Source avec Zip SIMPLIFIER LA CREATION DYNAMIQUE D'ELEMENT HTML par kazma
DÉTECTER SI CSS EST ACTIVÉ par jdmcreator

 Sources en rapport avec celle ci

Source avec Zip MOOTABLEAU par Miky76
Source avec une capture JEU DE COULEURS DANS UN TABLEAU À 3 DIMENSION par Niidhogg
Source avec Zip TRI DÉCROISSANT ET CROISSANT D'UN TABLEAU DYNAMIQUE REMPLIE ... par barbe91
Source avec Zip PALETTE DE COULEURS par lgh
Source avec Zip TEXTAREA : LIMITER LA LARGEUR ET LA HAUTEUR DU TEXTE SAISIE par vilfarfadet

Commentaires et avis

Commentaire de c_raf le 25/11/2007 11:29:15 9/10

Je viens de regarder tout ton code javascript et j'aimerai que tu m'explique les premières lignes

if (vartaille>1){
var taille=parseInt(vartaille);      
var nbr=0;
var damier=new Array(taille);
var nbrcarre = parseInt(taille / 2);


et aussi cette partie de code:

if (taille%2){
damier[premiereligne][premiereligne]=nbr;
//affichage
affichagetableau(damier);
}


Je te remercie beaucoup nickadele

Commentaire de nickadele le 25/11/2007 11:51:35 administrateur CS

Bonjour,

si la taille du carré est supérieure à 1
if (vartaille>1){
je m'assure d'avoir une valeur entière, pour bien faire il faudrait également tester qu'il ne s'agit pas d'une chaine de caractère ou d'une valeur undifined
var taille=parseInt(vartaille);      
var nbr=0;
var damier=new Array(taille);
Calcul le nombre de carré qu'il y a dans mon carré initiale en fonction de la taille
ex : si j'ai un carré de taille 4 il contient 2 carrés (4/2)
var nbrcarre = parseInt(taille / 2);
...........
il s'agit du calcul du modulo (reste d'une division) si taille vaut 5, la division de 5 par 2 donne comme reste 1 (5%2)=1. J'ai fait ce test car si tu regardes le remplissage du carré avec une taille impaire tu t'apercevras qu'il reste un carré de 1 sur 1 (le centre) en fin de remplissage. Il faut donc le remplir avec la dernière valeur.
if (taille%2){
damier[premiereligne][premiereligne]=nbr;
//affichage
affichagetableau(damier);
}

Commentaire de c_raf le 25/11/2007 15:11:19

Merci nickadele pour le post que tu as mis sur le site, je l'ai regardé et j'ai mieux compris et sa ma permis d'optimiser mon code et j'en arrive a un code similaire au tiens. En fait je me prenait trop la tête avec les lignes et colonnes mais la j'ai mieux compris et j'ai bien commenté mon code afin de le refaire correctement à tout moment.

Et tu avais raison pour les compteurs, maintenant j'en utilise plus que un seul.


Franchement merci à toi d'avoir pris sur ton temps pour m'aider à faire ce tableau spirale et franchement c'est vraiment gentil de ta part de m'avoir accordé cette aide précieuse nickadele.


MERCI MERCI MERCI

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Remplir un tableau en fonction d'un SELECT [ par simsai ] Bonjour,mon probleme: je ne vois pas comment faire pour remplir le contenu d'un tableau en fonction de la selection de mon select?J'ai une page que j' Remplir un tableau grace a une base de donnée [ par adakick ] Bonjour, je voudrai remplir un tableau avec des donn&#233;es pr&#233;sentes en base de donn&#233;es.Si vous savez faire, sa m'aiderai bien.Merci. tableau spirale [ par c_raf ] Es ce que quelqu'un aurait une idée pour réaliser ce genre de tableau en javascript??? je débute et je n'y arrive pas dutout...<img src="http://www.ja tableau dynamic [ par kbinfo ] Comment remplir un tableau a partir d'un formulaire html on doit remplir ce tableau dynamiquement Remplir Tableau à partir formulaire SANS PHP [ par danvy ] bonjour,&nbsp;voila j'expose mon probleme:j'ai un tableau en colonne les personnes et en lignes les jours de la semaine.Ensuite par menu deroulant, j' Remplir une liste deroulante avec un tableau [ par grandyaka54 ] Bonjour, Je souhaite remplir une liste deroulante avec l'aide d'un tableau lors du demarrage de la page. Etant debutant, je n'arrive pas a remplir la Empêcher l'élargissement d'un tableau??? [ par zut69 ] <td id="HB_Focus_Element" unselecta Effacer un élément quelconque d'un tableau Array, et changé l'indice de tous les élements suivants (donc diminuer la taille du tableau) [ par sagat06 ] Bonjour à tous,je suis toujours sur un projet qui me fait perdre la boule (à chaque problème résolu, un nouveau apparait !!).Bref, cette fois-ci, j'ai Tableau dynamique [ par alia10 ] Salut,J'aimerais que vous m'aidez à créer des tableaux dynamiques en HTML: ajouter, modifier et supprimer des lignes.Merci d'avance! Boucle sur un script Ajax [ par caviar ] Salut à vous ô forts du JS...Je suis une fois de plus en train de galérer... enfin cette fois ci je crois que c'est enfin sur un problème digne de ce


Nos sponsors


Sondage...

CalendriCode

Mars 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,593 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales