begin process at 2012 02 10 09:39:55
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

3D

 > [FLASH MX] AFFICHER DE LA 3D

[FLASH MX] AFFICHER DE LA 3D


 Information sur la source

Note :
8,44 / 10 - par 9 personnes
8,44 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :3D Niveau :Expert Date de création :16/06/2002 Date de mise à jour :18/06/2002 00:25:40 Vu / téléchargé :26 916 / 2 490

Auteur : Dean

Ecrire un message privé
Commentaire sur cette source (23)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
Ce *.fla montre de manière simple comment afficher des formes géométriques en 3D polygonale sous Flash (via Action Script) et la manière dont on peut effectuer des transformations de base (translations, rotations) sur les points pour obtenir des animations.
Il s'agit d'un modeste moteur 3D, imparfait certes, mais le résultat est là !

La mise à jour permet maintenant de remplir les faces avec une couleur et même d'obtenir des effets de transparence en changeant l'alpha ! (voir capture)
Vous pouvez aussi enlever les traits pour ne laisser que la couleur.

Source

  • //Voici un petit aperçu de ce qui vous attend :
  • //============================
  • //**Paramètres**
  • /*Emplacement de l'origine.
  • Sert de référence pour afficher les points dans
  • l'espace.*/
  • origine_x=Stage.width/2;
  • origine_y=Stage.height/2;
  • /*Distance entre celui qui regarde et l'écran.
  • Selon sa valeur, accentue plus ou moins l'effet de
  • perspective lors du rendu.*/
  • distance=Stage.width/2;
  • //**Fonctions**
  • /*Sert à créer un point en retournant un objet
  • renfermant les coordonnées de celui-ci dans
  • l'espace.*/
  • function point(x,y,z){
  • triplet=new Object();
  • triplet.x=x;
  • triplet.y=y;
  • triplet.z=z;
  • return triplet;
  • }
  • /*Permet de relier 3 points entre eux par des
  • traits, et avec un remplissage. Les points sont des
  • objets retournés par la fonction du même nom.
  • La couleur est à rentrer sous la forme
  • héxadécimale et l'alpha doit être une valeur
  • comprise entre 0 et 100*/
  • function face(point1,point2,point3,couleur,alpha){
  • polygone=new Object();
  • polygone.sommet1=point1;
  • polygone.sommet2=point2;
  • polygone.sommet3=point3;
  • polygone.couleur=couleur;
  • polygone.alpha=alpha;
  • return polygone;
  • }
  • /*Fonctions de translation : elles permettent
  • de déplacer un point sur les axes du repère.*/
  • function translation_x(point,valeur){
  • point.x+=valeur;
  • }
  • function translation_y(point,valeur){
  • point.y+=valeur;
  • }
  • function translation_z(point,valeur){
  • point.z+=valeur;
  • }
  • /*Fonctions de rotation : elles permettent
  • de faire tourner un point autour des axes du
  • repère.*/
  • function rotation_x(point,angle){
  • angle=angle*Math.PI/180;
  • y=point.y;
  • z=point.z;
  • point.y=y*Math.cos(angle)-z*Math.sin(angle);
  • point.z=z*Math.cos(angle)+y*Math.sin(angle);
  • }
  • function rotation_y(point,angle){
  • angle=angle*Math.PI/180;
  • x=point.x;
  • z=point.z;
  • point.x=x*Math.cos(angle)-z*Math.sin(angle);
  • point.z=z*Math.cos(angle)+x*Math.sin(angle);
  • }
  • function rotation_z(point,angle){
  • angle=angle*Math.PI/180;
  • x=point.x;
  • y=point.y;
  • point.x=x*Math.cos(angle)-y*Math.sin(angle);
  • point.y=y*Math.cos(angle)+x*Math.sin(angle);
  • }
  • //**Autres variables et fonctions**
  • faces=new Array();
  • function ordre(a,b){
  • z1=a.z;
  • z2=b.z;
  • if(z1>z2) return -1;
  • else{
  • if(z1<z2) return 1;
  • else return 0;
  • }
  • }
//Voici un petit aperçu de ce qui vous attend :
//============================

//**Paramètres**
/*Emplacement de l'origine.
Sert de référence pour afficher les points dans
l'espace.*/
origine_x=Stage.width/2;
origine_y=Stage.height/2;

/*Distance entre celui qui regarde et l'écran.
Selon sa valeur, accentue plus ou moins l'effet de
perspective lors du rendu.*/
distance=Stage.width/2;


//**Fonctions**
/*Sert à créer un point en retournant un objet
renfermant les coordonnées de celui-ci dans
l'espace.*/
function point(x,y,z){
	triplet=new Object();
	triplet.x=x;
	triplet.y=y;
	triplet.z=z;
	return triplet;
}

/*Permet de relier 3 points entre eux par des
traits, et avec un remplissage. Les points sont des
objets retournés par la fonction du même nom.
La couleur est à rentrer sous la forme
héxadécimale et l'alpha doit être une valeur
comprise entre 0 et 100*/
function face(point1,point2,point3,couleur,alpha){
	polygone=new Object();
	polygone.sommet1=point1;
	polygone.sommet2=point2;
	polygone.sommet3=point3;
	polygone.couleur=couleur;
	polygone.alpha=alpha;
	return polygone;
}

/*Fonctions de translation : elles permettent
de déplacer un point sur les axes du repère.*/
function translation_x(point,valeur){
	point.x+=valeur;
}
function translation_y(point,valeur){
	point.y+=valeur;
}
function translation_z(point,valeur){
	point.z+=valeur;
}

/*Fonctions de rotation : elles permettent
de faire tourner un point autour des axes du
repère.*/
function rotation_x(point,angle){
angle=angle*Math.PI/180;
y=point.y;
z=point.z;
point.y=y*Math.cos(angle)-z*Math.sin(angle);
point.z=z*Math.cos(angle)+y*Math.sin(angle);
}
function rotation_y(point,angle){
angle=angle*Math.PI/180;
x=point.x;
z=point.z;
point.x=x*Math.cos(angle)-z*Math.sin(angle);
point.z=z*Math.cos(angle)+x*Math.sin(angle);
}
function rotation_z(point,angle){
angle=angle*Math.PI/180;
x=point.x;
y=point.y;
point.x=x*Math.cos(angle)-y*Math.sin(angle);
point.y=y*Math.cos(angle)+x*Math.sin(angle);
}


//**Autres variables et fonctions**
faces=new Array();

function ordre(a,b){
	z1=a.z;
	z2=b.z;
	if(z1>z2) return -1;
	else{
		if(z1<z2) return 1;
		else return 0;
	}
}

 Conclusion

Allez, prochaine étape : les déplacements.

Si quelqu'un a une idée particulière, qu'il me la communique !
Et si vous avez des remarques, n'oubliez pas de m'en faire part !

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Sources du même auteur

Source avec Zip SAUVEGARDER UN DOCUMENT XML DANS UN FICHIER
Source avec Zip Source avec une capture SWF À FOND TRANSPARENT (HTML)
CHANGER L'ICÔNE D'UNE PROJECTION FLASH
[FLASH MX] CONVERTIR UN BITMAP EN VECTORIEL

 Sources de la même categorie

Source avec Zip Source avec une capture FORMULE 1 3D par gremlins7
Source avec Zip Source avec une capture GET_RELATIVE_MATRIX3D: LE CONCEPT... par top30
Source avec Zip Source avec une capture MENU CARROUSEL FULL 3D CS4 par gremlins7
Source avec Zip Source avec une capture CARROUSEL EN VRAI 3D SOUS CS4 par pegase31
Source avec Zip Source avec une capture UNE TÊTE REGARDE LA SOURIS (ILLUSION DE 3D) par daddy11world

Commentaires et avis

Commentaire de Dean le 21/06/2002 10:34:37

Désolé mais il y a quelques bugs au niveau de la gestion d'affichage des faces.

Si quelqu'un a une méthode pour savoir si une face est plus devant ou plus derrière, ce serait sympa qu'il me la donne ! Je l'ajouterai bien entendu dans ceux qui ont participé à la conception du moteur !

Dean

Commentaire de stv le 26/01/2003 18:55:18

pas mal du tout ton script
j'vais pauffiner pour optimiser
a+

Commentaire de kipetrovitchy le 30/01/2003 18:37:38

Putain...  (euh pardon je devrais dire Maman)
Il ne reste plus qu à trouver le moyen de mapper les polygones et là...

Commentaire de Magicking le 09/03/2003 16:42:52

Je comprend pas pkoi tu dis qui faut faire un triangle pour pouvoir afficher de la couleur sa marche avec un carre aussi...

Commentaire de Dean le 09/03/2003 21:22:53

Oui mais le triangle est la figure géométrique de base à partir de laquelle on peut tout faire: carré, et autres polygones. C'est juste une question de simplification et d'optimisation !

Commentaire de Magicking le 12/03/2003 16:25:12

oui... c'est vrai en tout cas ce tutorial est excellent pour debuter en 3d avec flash

Commentaire de Dean le 12/03/2003 16:35:55

J'ai réalisé cette source grâce à un tutorial génial que j'ai trouvé sur www.macromedia.com. C'est un extrait du bouquin "Flash Super Samouraï" qui traite de la programmation avancée avec Flash.

C'est le tuto ultime !

Commentaire de Adrianzo01 le 22/04/2003 10:30:45

mm malgré les bugs ca déchire kan mm ca fai stylé
merci pr cette source
adrianzo

Commentaire de KamANK le 29/04/2003 17:57:02

Yeap, ca rend bien, et c'est assez léger.
Pour ce qui est du tri des faces, la méthode la plus simple, c'est déjà de différencier faces visibles et faces non visibles, les faces non visibles devant être affichées en premier.
Pour ca, on calcule  la normale au triangle (un simple produit de vecteur fait l'affaire. Rechercher dot product pour plus d'infos...).
Ensuite, tu peux trier suivant le Z moyen. En gros, tu fais la moyenne de la profondeur des 3 pts de ton triangle, et tu tries la dessus... C'est pas le plus propre, mais c'est mieux que rien :)

Commentaire de Dean le 29/04/2003 21:23:44

OK, je regarderai si je me remets à la 3D ;-) Merci beaucoup !

Commentaire de skaze le 09/06/2003 09:38:44

oui c'est vraiment bien fait mai il existe un logitiel qi s'appelle swift v3 compatible avec flashen moin de 1 minute on peut faire un carre qui tourne et apres lexporter dans flash ;) , de multiples actions sont possible et c'est vraiment facile fciale a utiliser !!

Commentaire de Dean le 09/06/2003 12:33:50

Oui je sais que ma source n'est plus d'actualité et que l'on peut faire beaucoup mieux, mais ça peut quand même être utile pour comprendre quelques trucs non ?

Commentaire de Magicking le 09/06/2003 17:38:34

swift c bien mais avec cette source sa permet de faire bouger le carre dans n'importe quelle sens par exemple avec le clavier

Commentaire de Rabz le 08/09/2003 17:57:44

swift 3D fait bien des chose mais.... je trouve l'exportation tres lourde !!!

Commentaire de jio le 10/03/2004 11:46:31

Bon ce qui serait bien maintenant c'est définir des fonctions cube, cylindre, pyramide, tore, etc... qui permettent de dessiner facilement des formes geometriques de base. Et aussi une fonction skybox !!! ouais :D

L'idéal serait de réussir à faire une gestion de la 3D style OpenGL (avec des variable d'Etat). C'est possible ;)

Commentaire de jio le 10/03/2004 11:49:34

Bon ce qui serait bien maintenant c'est définir des fonctions cube, cylindre, pyramide, tore, etc... qui permettent de dessiner facilement des formes geometriques de base. Et aussi une fonction skybox !!! ouais :D

L'idéal serait de réussir à faire une gestion de la 3D style OpenGL (avec des variable d'Etat). C'est possible ;)

Commentaire de Dean le 10/03/2004 16:25:02

Oui, en fait il est possible de faire des trucs intéressants, mais il y a longtemps que j'ai abandonné... car :
1) Flash ne permet pas de gérer un environnement 3D riche de manière efficace ;
2) D'autres ont déjà fait des moteurs complets, utilisant notamment les composants. Il n'y a plus qu'à éplucher les sources. :)

Commentaire de Marvin le 22/04/2004 21:22:33

quelqun pourrait me dire pourquoi le link marche pas
sinon sa a l'air bien

Commentaire de nicosalto le 03/12/2004 22:13:11

Bonjour
je me serre de ta source (qui est très bien documentée ,en passant) mais j'aimerai savoir s'il serai possible d'insérer à la place des couleurs dans les faces des clips. Ou transformer certaines faces en bouton??
merci
nc

Commentaire de sidhannowe le 15/04/2005 23:21:13

Très bonne source.

Par contre ca bug pas mal lorsque j'effectue une double rotation (x et y) et une translation en z

Commentaire de hpotter le 14/07/2005 15:47:40

tout simplement magnifique

Commentaire de laul333 le 16/09/2009 13:45:29

Bonjour,

Très bon travail, je voudrais savoir comment faire tourner le cube sur 2 axes.
merci d'avance

Commentaire de Dean le 16/09/2009 15:18:15

Salut,

Peut-être peux-tu essayer d'utiliser les fonctions rotation_x/rotation_y (celles que j'aperçois dans le listing), en les appliquant successivement ?

Voilà, sinon cette source est un peu vieille, on peut tout faire avec des matrices, mais la méthode exposée ici reste un peu plus simple à comprendre.

 Ajouter un commentaire




Nos sponsors


Sondage...

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
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,858 sec (4)

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