Lords Of Utopia

[Lords Of Utopia] Prototype de terrain 2D isométrique – étape 1 terminée

Laisser un commentaire

Comme dit dans le titre, l’étape 1 du prototype de terrain 2D isométrique est terminée 🙂 Le terrain en losange s’affiche entièrement lorsqu’on fait glisser l’écran avec les touches fléchées du clavier, et tout est parfaitement positionné en cohérence avec la grille de données du moteur. Que ce soit pour ce prototype, ou pour le musée virtuel, j’ai remarqué que c’était très lent. J’ai ce problème uniquement quand je compile la version HTML5 pour le poster ici. Quand je le teste en Neko, ça va mieux. Je vais devoir étudier les meilleurs formats à vous proposer sur ce blog pour jouer mes programmes sur navigateur 🙂

LordsOfUtopia_Proto_2017-08-16Retrouvez le prototype testable en cliquant sur l’image de cet article 🙂

Compte-rendu hebdomadaire

Avancement du vlog 3, TFL 0.7, jeu sur navigateur, 7 Days to Die et anecdote onirique

Laisser un commentaire

La semaine du 7 au 12 août 2017 s’est concentrée sur le script du vlog 3, le démarrage d’un nouveau jeu en ligne et The Fantastic Labyrinth 0.7. Concernant le vlog 3, je veux encore travailler le script parce que ce n’est vraiment pas facile de parler de mes difficultés en raison d’une culpabilité alimentée par la société actuelle. Mais justement, j’ai écris ce que j’avais sur le cœur, et je pense ne pas revenir dessus. J’essaye juste de ne pas rendre ce vlog trop indigeste, et laisser une impression de pessimisme. En tout cas, j’ai eu envie d’apporter un peu d’humour dans ce que je raconte. Du coup, je me laisse du temps pour le réaliser, même si ça traîne depuis un long moment.

LordsOfUtopia_Proto_2017-08-09Le nouveau projet est un jeu en ligne sur navigateur en HaxeFlixel intitulé Lords Of Utopia. Si vous suivez toutes les publications de ce blog, vous avez vu passer l’article dessus. Sinon, voici le lien : [Lords Of Utopia] Premier prototype pour tester le terrain. Je viens d’avancer un petit peu sur le prototype pour afficher le début du terrain en forme de losange, puisque au début, la forme générale n’était pas un losange. Seuls les tuiles du terrain étaient des losanges. Et j’ai aussi développé le positionnement en X uniquement du terrain par rapport à son repère et à l’écran de jeu. On peut aussi déplacer avec les touches flèches à gauche et à droite pour tester la cohérence de la position en X. Je ferais dés que possible le positionnement en Y et la partie basse du losange du terrain. Pour tester le résultat 🙂

Je n’ai pas beaucoup avancé sur le jeu de labyrinth. En tout cas, pas de code ces derniers temps, mais j’approche de la fin des graphismes des murs des niveaux 26 à 30. Une fois cela fait, je coderais une petite animation sympa pour les niveaux 23 et 24. Puis, je pourrais attaquer le reste des nouveautés dans le gameplay 😉

7DaysToDie_2017-08-11Bon pourquoi j’ai avancé que doucement sur TFL, le vlog 3 et le prototype de LOU ? Et bien parce que parfois il faut savoir lâcher prise pour se reposer un peu. Surtout que dernièrement j’ai eu des problèmes de sommeil et donc de la fatigue. Je me suis donc offert le jeu 7 Days to Die, parce que quand vous avez du mal à dormir, rien de tel qu’un jeu d’horreur 😀 J’y joue depuis 3 jours et demi. Là je me suis un peu calmée parce que j’ai réussi à crafter la forge et me faire une bêche pour tester l’agriculture, et parce que je voulais avancer un peu sur LOU, TFL et écrire ce compte-rendu 🙂 Je vous ferais un petit article sur 7 Days to Die, parce que j’aime beaucoup, et que je tremble souvent avec le cœur qui bat tellement il y a d’instants effrayants x)

Pour la blague que je viens de faire sur le sommeil et les jeux d’horreur, j’en rigole parce que je ne fais plus de cauchemars depuis longtemps. A vrai dire, en général, si dans un cauchemar, des zombies m’attaquent, j’utiliserais mes super pouvoirs. Après l’invincibilité, le vol, la force et la vitesse, récemment j’ai vécu en rêve, l’expérience de la vision à travers les objets et les murs et le laser optique. C’est qui la super girl ? 😀

Lords Of Utopia

[Lords Of Utopia] Premier prototype pour tester le terrain

Laisser un commentaire

Je vous présente un N-ième projet… Oui j’abuse x) Pour le moment, il s’agit d’un prototype dans lequel je teste une approche que j’ai imaginé pour afficher des losanges d’un terrain en 2D isométrique. Le but est de créer un jeu de construction et gestion de royaume utopique :p Le jeu sera donc exclusivement multijoueurs, puisque c’est un jeu par navigateur. Je souhaite rendre l’accès au jeu payant, par abonnement mensuel pour un prix modique. J’ai besoin d’arriver à un revenu viable assez rapidement, mais les projets réalisés jusqu’à maintenant sont peu adaptés dans leur état actuel à ça. Et encore, avec le risque de ne pas rencontrer de succès. Donc, si je peux mettre en place un jeu basé sur un modèle économique plus régulier et potentiellement plus rentable, ça m’aiderait beaucoup 🙂 C’est la raison pour laquelle, je m’attaque dés maintenant à ce projet, alors que ça fera un N-ième projet en parallèle. Bon, en même temps c’était prévu puisque je l’avais noté dans les jeux à démarrer cette année 🙂

LordsOfUtopia_Proto_2017-08-09Comme pour mon éditeur de musée virtuel, qui fait une toute petite pause pour travailler sur les autres projets, vous pouvez accéder au prototype en cliquant sur l’image 🙂 Au stade de cet article, le prototype ne permet aucune interaction. Il s’agit du résultat de quelques équations de changement de repère en image. A gauche, c’est le terrain dans son propre repère avec l’écran représenté en losange. Et à droite, c’est le petit écran qui montre ce que ça donne en jeu avec le terrain basé sur les losanges isométriques 🙂 Évidemment, les losanges et tout le reste ne sont pas exhaustifs, et ne sont là que pour tester mes algorithmes 🙂

Timidouveg's Museum

[Timidouveg’s Museum] Système de décision de l’ordre des points et surbrillance des secteurs

Laisser un commentaire

J’ai mis en ligne les dernières nouveautés dans l’éditeur de mon futur musée virtuel. Comme je l’avais indiqué dans les premiers tutoriels d’algorithmie/mathématiques sur ce blog, j’ai conçu un système de décision de l’ordre approprié pour les points d’un polygone qui assure que peu importe dans quel sens vous dessinez vos secteurs, l’intérieur sera bien à l’intérieur et l’extérieur à sa bonne place 😀 Comme d’habitude, cliquez sur l’image pour accéder à l’éditeur de musée virtuel 🙂

TimidouvegMuseum_2017-07-31Autre chose que j’ai ajouté à l’aide des fonctions affines dont j’ai parlé dans le troisième tutoriel en utilisant le terme d’équation cartésienne d’ailleurs. Ce n’est pas tout à fait faux puisqu’une fonction affine est une équation cartésienne simplifiée pour une droite en 2 dimensions 😉 Bref, il est maintenant possible de mettre en surbrillance jaune les secteurs sous le curseur de la souris. Pour l’instant ça n’apporte rien au dessin, mais ça entrera par exemple dans une fonctionnalité permettant d’afficher des informations sur le secteur ou encore ajouter des polygones internes pour dessiner pourquoi pas des colonnes ou des murs au milieu d’une salle.

Une dernière chose, on peut toujours activer/désactiver le mode « Création de secteur » avec la touche C du clavier, mais en haut à gauche de l’écran est disponible un bouton pour le faire avec la souris. Comme la touche, il faut cliquer à nouveau sur le bouton pour désactiver le mode et pouvoir déplacer des points. J’ai mis un bouton simple, mais j’envisage de mettre un bouton qui reste enfoncé quand activé, lorsque j’aurais compris les classes qui permettent de faire ça ;p

Compte-rendu hebdomadaire

Validisme, moteur Build-like, graphisme et Les Carencés

Laisser un commentaire

La semaine du 24 au 29 juillet 2017 a commencé avec un peu de travail sur le vlog 3. Pas grand chose, j’ai surtout refait le doublage. Je ne suis pas encore tout à fait satisfaite par la deuxième partie. Je crois que j’ai un vrai soucis pour parler de mes difficultés, de ce qui me handicap. Problème de sentiment d’illégitimité alors que je devrais reconnaître que ce qui me ralentis dans la vie est vraiment indépendant de ma volonté. Et puis, il y a surtout cette impression de trop parler de ça. Je ne sais pas si les remarques abjectes d’un type que j’ai viré de mes contacts il y a plusieurs mois m’ont donné le sentiment qu’en parler autant m’attirerait les remarques validistes et haineuses, et du coup je n’ose pas trop aborder clairement le sujet dans mon vlog. J’ai eu le courage, même si j’en avais surtout besoin, de faire mon coming out transgenre, et là j’ai du mal à parler de ce qui me handicap dans la vie et le travail. Il faut que j’arrive à assumer ce que je voulais partager avec vous sur ce vécu. Peut-être que je devrais ajouter cette inquiétude qui m’amène à m’autocensurer et au moins ça permettra de rappeler la gravité de propos ou mentalités oppressives contre les gens qui rencontrent mes difficultés, en particulier quand on a des privilèges par rapport à d’autres gens qui souffrent ou ont 1000 fois pire que soi.

J’ai aussi avancé un peu sur le dessin de Fulren, la superhéroïne transgenre et transhumaine. Et dans le même domaine, le dessin, j’ai avancé un peu tout les jours à peu près, sur le doodle de ma chère amie et deuxième tipeuse 🙂 J’ai aussi préparé quelque idées et un petit plan pour Demiurge Mini, mais ensuite je n’ai pas trouvé le temps et la motivation pour avancer sur le code ou le graphisme. A la place, j’ai avancé sur le graphisme de The Fantastic Labyrinth v0.7 et aussi et surtout j’ai codé mon éditeur de musée virtuel et posté des tutoriels de mathématiques/algorithmie. Ce musée, et surtout la reproduction très personnelle du moteur Build de ken Silverman en Haxeflixel, m’obnubile x) J’ai plus envie de travailler là-dessus qu’autres choses ces temps-ci. Le dessin quant à lui me détend et me permet d’écouter des rediffusions de ce qui se passe en ce moment à l’Assemblée Nationale, ou des documentaires et trucs septiques ou scientifiques. Écouter quelque chose en codant est quasi impossible puisqu’il faut réfléchir à ce qu’on code, par contre en dessinant ou faisant de la coloration, ça n’occupe pas les mêmes aires du cerveau que l’écoute et la compréhension des discours et discussions. J’essaye de suivre ce qui se décide dans le pays, ou apprendre des trucs, pendant ces moments là 🙂

Bon, dernière information sur cette semaine, quelque chose qui m’a fait très plaisir et m’a aussi surtout intimidé x) Je vous mets le lien vers l’épisode 6 du podcast Les Carencés, parce que j’ai répondu à un sondage lancé sur twitter et GurrenVegan a cité quelques réponses qui lui semblaient intéressantes. Il se trouve que je suis la première cité dans le podcast. Le sujet du sondage commence aux environs de 55 minutes, mais écoutez tout, si vous le souhaitez, parce que qu’il y a du boulot derrière de la part de l’équipe 😉 L’émission Les Carencés dénonce pas mal de trucs et aussi donne des bonnes nouvelles pour les animaux 🙂

Vous remarquerez qu’en me citant, Gurren se trompe de genre au début et se rattrape en disant « la personne ». C’est par habitude de dire « le mec » je pense. Une habitude de langage que j’ai aussi et que j’essaye de corriger x) J’avoue que sur le net, plusieurs personnes ont déjà eu ce soucis de ne pas savoir quel était mon genre à cause d’un pseudonyme pas très évocateur. Ce pseudo, Timidouveg, date évidement d’avant ma prise définitive de conscience de ma transidentité et donc ce fondait sur mon assignation de naissance masculine. Du coup, je le redis ici, même si je me demande si je ne devrais pas envisager de changer de pseudo un de ces quatre. Je suis une … déesse … lol bon une femme si vous préférez :p Même si j’ai une part de non-binarité, disons que je ne ressens pas un besoin vital à m’identifier par le féminin spécialement même si c’est ma préférence. En tout cas, je n’aime pas le faire par le masculin. Du coup, me genrer au féminin, ou à défaut au neutre, « la personne » comme l’a dit Gurren en rectifiant, sont mieux pour me sentir bien dans les pronoms et accords 🙂

Algorithmie, Timidouveg's Museum

Détecter si un point est avant, sur ou après une droite

Laisser un commentaire

Parfois, il est intéressant de savoir si un point est sur une droite, avant ou après. Dans mon moteur Build-like pour mon musée virtuel, par exemple, détecter cela entre dans le système de décision du sens du dessin. Si un polygone est dessiné dans un sens, il sera considéré à l’endroit (normales dirigées vers l’intérieur) ou dessiné dans l’autre sens, il sera considéré comme à l’envers (normales dirigées vers l’extérieur). J’expliquerais ce système de décision dans un autre article qui marie la technique pour trouver le sens d’un segment et celle présenté ici 🙂

Detecter point droite 1Dans le dessin ici présent, on peut voir une droite et trois points. Le point A et avant la droite, soit négatif. Le point B est sur la droite, soit à zéro. Le point C est après la droite, soit positif. Pour calculer le signe du rapport entre le point et la droite, il faut d’abord calculer l’équation cartésienne de la droite à partir d’un vecteur de cette droite. Prenons un segment et calculons son vecteur directeur. J’explique cela dans l’article Calculer la norme, la normale et le milieu d’un segment. Voici comment déterminer l’équation cartésienne de ce vecteur directeur non horizontale, ni verticale. Ces deux cas particuliers seront déterminés ensuite.

Équation à déterminer :
Vecteur.y = a * Vecteur.x + b
Détermination de a et b :
a = Vecteur.y / Vecteur.x
b = Vecteur.y - a * Vecteur.x

Voilà, une fois cette équation obtenue il s’utilise simplement en plaçant des coordonnées du point à détecter sur ou autour de la droite à la place y et x et déplacer y dans l’équation de sorte à obtenir un nombre inférieur, égal ou supérieur à zéro.

Détection = a * Point.x + b - Point.y

Avant d’expliquer avec un schéma où se situe la positif et le négatif pour les différentes droites possibles, voici comment traiter les droites horizontale et verticale.

Équation horizontale :
Vecteur.y = b
Donc :
a = 0
b = Vecteur.y
Équation verticale :
Vecteur.x = a
Donc :
a = Vecteur.x
b = 0

Pour l’utilisation de ces équations, il n’y a pas de difficulté pour la droite verticale, par contre pour la droite horizontale, il y a un sens à respecter pour obtenir un résultat signé correctement comme vous le verrez sur le schéma qui suivra.

Avec la droite verticale :
Détection = Point.x - a
Avec la droite horizontale :
Détection = b - Point.y

Detecter point droite 2La logique de ces équations ressort dans le schéma suivant. Dans un repère avec X allant de gauche à droite, et Y allant de haut en bas, cela se passe comme suit. Pour la droite horizontale, le signe positif se trouve à droite et le négatif à gauche. Pour la droite horizontale, le signe positif se trouve en haut et le négatif en bas. Le sens est inversé par rapport au repère pour cette droite. Enfin, les autres droites, en les imaginant tourner de la droite verticale en partant d’en haut (au-dessus de zéro), et tournant vers la gauche, le positif est donc à droite de la droite, parties bleue et rouge confondus. Une fois que le haut (bleu) de la droite dépasse la droite horizontale, toujours en tournant vers la gauche, donc se trouve en dessous, le positif est au-dessus de la droite et le négatif en dessous, et tend vers la droite du repère. La rotation s’arrête peu avant de revenir à une droite verticale, autrement le positif à gauche pour la partie bleue de la droite en bas change de côté. C’est visible pour la partie rouge de la droite verticale qui suit le sens de sa partie bleue.

Ce principe rappelle mon schéma pour le Calcul du sens d’un segment, à la différence que l’axe des changements de sens n’est pas l’axe des X, mais celui des Y. En adaptant ce schéma du sens d’un segment à celui-ci, j’ai pu marier les deux techniques et concevoir mon système de prise de décision du sens du dessin et de où se trouve l’intérieur et l’extérieur d’un secteur dessinés sans  que nous utilisateurices n’ayons à nous soucier du sens du dessin. Ce sera expliqué au prochaine article 🙂

Timidouveg's Museum

[Timidouveg’s Museum] Déplacer les points créés et normale

Laisser un commentaire

Il y a quelques jours j’ai ajouté la possibilité de déplacer les points créés dans un secteur, au cas où l’utilisateurice se trompe ou simplement pour modeler son secteur à sa convenance. Je n’ai pas encore ajouté de boutons pour changer de mode, ni pour témoigner du mode dans lequel vous êtes. Il y a maintenant deux modes dans l’éditeur. Le mode création de secteurs que vous pouvez activer en appuyant sur la touche C du clavier, et le mode déplacement de points, en appuyant à nouveau sur C. Lors que vous arrivez sur l’éditeur, le mode actif est le déplacement de points. Vous ne pouvez donc pas créer de secteurs avant d’avoir appuyé une fois sur C. Attention à ne pas oublier d’appuyer sur C pour déplacer les points mal placés, autrement vous risquez de créer de nouveaux points en cliquant que un d’entre eux. Ce n’est pas pratique, et ce sera changé à l’avenir. Aussi un message indiquant le numéro du point apparaît en bas à gauche lorsqu’il est en cours de déplacement.

TimidouvegMuseum_2017-07-26Petit détail qui va évoluer aussi pour des raisons pratiques, en mode déplacement de points, chaque point survolé par le curseur de la souris est orange. Dés que vous cliquez sur le point, il devient jaune et si vous bougez avec le bouton de la souris enfoncée, le point et les lignes du dessin suivent la souris. La sélection orange utilise une simple condition d’égalité entre la position du point et la souris. Ce n’est pas pratique parce qu’il faut se mettre vraiment dessus et non un peu à coté pour attraper le point. C’était pour la première étape des tests à ce sujet, mais je changerais de méthode pour un cercle de détection autour du point et un système de choix du point le plus proche de la souris 🙂

Dans cette nouvelle version de l’éditeur, j’ai fais apparaître un fond blanc transparent qui permet de distinguer l’intérieur d’un secteur de l’extérieur (le vide). J’ai aussi ajouté des petits traits oranges au milieu des segments. Ces traits sont les normales des segments qui permettent de visualiser le sens des segments dont j’ai parlé dans l’article Calculer le sens d’un segment. J’explique dans l’article Calculer la norme, la normale et le milieu d’un segment, comment j’ai conçu ce petit système.

Rappel du lien vers l’application : Timidouveg’s Museum. Vous pouvez aussi cliquer sur l’image que pour y accéder 🙂

Algorithmie, Timidouveg's Museum

Calculer la norme, la normale et le milieu d’un segment

Laisser un commentaire

Dans cet article on va parler de comment calculer simplement la norme, la normale et le milieu d’un segment en 2 dimensions. L’intérêt est multiple, mais en ce moment, ces trois calculs me servent à afficher les normales des murs des secteurs dans l’éditeur de mon moteur de musée virtuel. Je m’en suis servit en partie dans Demiurge, en 3D, sauf pour la normale qui nécessite l’utilisation d’un produit en croix pour les surfaces (cross product en anglais).

Le milieu d’un segment

Commençons par le milieu d’un segment qui ne nécessite pas les deux autres pour être calculé. En 2D, pour calculer simplement le milieu d’un segment, il suffit tout d’abord de ramener le segment à son vecteur directeur, ici non normalisé, comme on la vue dans l’article sur le calcul du sens d’un segment. L’équation est simple, je le rappelle ici :

Vecteur = (xB - xA, yB - yA)

Ce vecteur, contrairement, au segment (sauf cas particulier) a sa position aux coordonnées (0, 0) et donc les coordonnées de la pointe du vecteur correspondent logiquement à la soustraction du deuxième point du segment par le premier point. Il s’agit d’une simplification du segment qui permet de lui faire toutes sortes de choses et notamment trouver le milieu, mais aussi sa normale. Mais, on verra après pour la normale 🙂

Pour trouver le milieu du segment, il reste deux étapes toutes simple. La première consiste à diviser par 2 les coordonnées du vecteur non normalisé. Ainsi, on obtient la moitié du vecteur. Puis, la deuxième et dernière étape consiste à ramener le vecteur à sa place en l’additionnant avec le premier point du segment.

DemiVecteur = (Vecteur.x / 2, Vecteur.y / 2)
Milieu = (xA + DemiVecteur.x, xB + DemiVecteur.y)

La norme du segment

La norme d’un segment est la distance entre le premier et le deuxième point qui le constitue. C’est à dire, pour faire simple, sa longueur. Peu importe que votre segment se trouve sur une grille de pixels, et donc soumis à un repère, il s’agit là de la longueur que vous obtiendriez si vous aviez une règle est mesureriez le segment 🙂

La formule de la norme est un peu plus compliqué et gourmand en ressources pour un ordinateur que ce qu’on a fait précédemment. Heureusement pour nous, elle a au moins le mérite de tenir sur une seule ligne :p

Norme = √(Vecteur.x²+Vecteur.y²)

Je le réécris différemment pour plus de lisibilité et de compréhension.

Norme = RacineCarrée( Carré(Vecteur.x) + Carré(Vecteur.y) )

J’ai utilisé ici le vecteur de tout à l’heure. En effet, on ne calcule pas directement la norme d’un segment, mais celui de son vecteur non normalisé. Et si depuis tout à l’heure je n’ai pas normalisé mon vecteur, c’est précisément parce que normaliser signifie qu’on le ramène à une norme de 1, hors nous voulons mesurer notre segment, ce serait donc absurde 🙂

Avec une norme on peut faire le calcul du milieu du segment d’une façon différente que la méthode précédente, mais aussi faire d’autres choses comme calculer la trajectoire d’un projectile par exemple. Cependant, pour y arriver, il va normaliser le vecteur. Je vais vous expliquer comment en même temps que le calcul de la normale d’un segment ou d’une droite 🙂

Normaliser un segment et calculer sa normale

Comme je l’ai dit tout à l’heure, normaliser un vecteur, c’est mettre sa norme à 1. Et pour faire cela, rien de plus simple 🙂

Normalisé = (Vecteur.x / norme, Vecteur.y / norme)

Voilà, c’est fait 😀 Il suffisait tout simplement de diviser les coordonnées du vecteur précédemment obtenu. C’est assez logique, puisque la norme est la longueur du vecteur de départ. Et c’est pour cette raison qu’un vecteur normalisé est très utile pour une trajectoire de projectile par exemple, puisque entre le moment où un personnage fait feu et un instant T, le projectile aura parcouru une certaine distance. Ainsi, connaître son vecteur directeur permet de simplement le multiplier par la distance parcouru pour trouver les coordonnées du projectile :p Si vous voulez par exemple, afficher un objet se déplaçant suivant un vecteur, vous pouvez associer une distance pour chaque quantum de temps (fraction du temps) et additionner ces distances à chaque instant pour ensuite le multiplier par le vecteur. A chaque quantum de temps, votre ordinateur affichera votre objet aux bonnes coordonnées et vous le verrez se déplacer sur votre trajectoire. Ajoutez à ceci, un vecteur de gravité, qui irait toujours vers le bas, soit ceci (0, y), et vous aurez la base d’un jeu de missile, sniper ou d’archer, et une part non négligeable d’un Worms x)

Bon, je vous raconte tout ça, mais il me reste un truc à vous expliquer. C’est le calcul de la normale au segment, ou plus tôt au vecteur. La normale d’un vecteur est un vecteur perpendiculaire au premier. Là encore, en 2 dimensions, trouver la normale d’un vecteur est simplicime. Voici la formule :

Normale =(-Normalisé.y, Normalisé.x)

Et voilà, hihihihi 😀 Tout simplement, la coordonnées X de la normale est égale à la coordonnées Y en négatif du vecteur directeur, et la coordonnées Y de la normale est égale à la coordonnées X du vecteur directeur. Ni plus, ni moins 🙂 Il n’y a donc pas réellement de calcules à faire, mais juste des assignations de valeurs.

C’est lorsqu’on fait des tests sur un papier ou à l’écran, qu’on comprend l’utilité de calculer le sens d’un segment comme je l’ai proposé en premier article de la série sur l’algorithmie. En effet, si vous placez les points de votre segment dans un ordre ou dans un autre, vous changerez nécessairement l’ordre de ces derniers dans les opérations précédemment expliqué ici. Ainsi, votre normale ne sera pas dans le même sens non plus. Pour un ligne horizontale par exemple, la normale sera soit vers le haut, soit vers le bas, selon l’ordre dans lequel vous avez entré vos deux points du segment. Cette propriété peut provoquer des erreurs d’affichages, de physique dans un moteur physique, mais aussi, bien exploitée, permettre de déterminer l’intérieur et l’extérieur d’un monde comme dans mon moteur de musée 🙂

Bonus : Dessiner une normale au milieu d’un segment

TimidouvegMuseum_2017-07-26Je vous mets un petit algorithme qui utilise tout ce qui est au-dessus pour dessiner la normale d’un segment.

DessinerSegment(xA, yA, xB, yB);
Vecteur(xB-xA, yB-yA);
Norme = RacineCarré(Carré(Vecteur.x) + Carré(Vecteur.y));
Normalisé = (Vecteur.x/Norme, Vecteur.y/Norme);
Normale = (-Normalisé.y, Normalisé.x);
Milieu = (xA+Vecteur.x/2, yA+Vecteur.y/2);
DessinerNormale(Milieu.x, Milieu.y, Milieu.x+Normale.x, Milieu.y+Normale.y);

Si les unités de votre dessin sont les pixels, la normale ne fera qu’un seule pixel et dans certains cas, il ne pourra pas s’afficher. Vous pouvez donc multiplier ses coordonnées par un nombre raisonnable pour bien voir la ligne s’afficher et apprécier la perpendiculaire a votre segment 🙂

Algorithmie, Timidouveg's Museum

Calculer le sens d’un segment

Laisser un commentaire

Sens segments 1Dans ma reproduction du moteur Build de Ken Silverman pour mon musée virtuel, j’ai eu besoin de déterminer le sens d’un segment. Je définis le sens du segment par est-ce que le segment va du point A au point B, ou du point B au point A. L’intérêt de savoir cela permet, dans mon moteur, de décider où se trouve l’intérieur et l’extérieur d’un polygone qui définit un secteur du musée. Lorsqu’on dessine un secteur, on ne fait pas toujours attention à l’ordre dans lequel on place les points qui le compose. Pour donner un exemple de l’intérêt de respecter l’ordre des points, dans OpenGL, placer les points dans un sens détermine la recto ou le verso d’un polygone, ce qui permet entre autres d’afficher l’un ou l’autre ou les deux. Dans mon moteur, en dessinant un secteur, si on se trompe dans l’ordre des points, l’intérieur ou l’extérieur seront inversés.

Comment faire simplement une détermination automatique du sens d’un segment pour ne pas avoir à le faire nous-même lors du dessin ? J’ai choisis d’utiliser les signes des coordonnées. D’abord, le moteur calcul un vecteur à partir des deux points du segment dans l’ordre dans lesquelles elles ont été dessinés. Ce dernier se calcule par l’équation suivante.

Vecteur = (xB - xA , yB - yA)

Une fois le vecteur correspondant au sens du segment, il suffit donc de regarder le signe des coordonnées. J’ai choisis d’indiquer le sens par négatif ou positif. Et je mets un dessin pour comprendre ce que ça donne pour toutes sortes de vecteurs sur 360°. Les sens sont déterminés de sorte à correspondre au cercle trigonométrique inversé dans l’axe Y en raison du fait que la plus part des repères graphiques sur ordinateur part du haut vers le bas et de gauche à droite. Ainsi le négatif est en haut pour les Y et le positif en bas.

Si Vecteur.x > 0 et Vecteur.y == 0 Alors
Sens positif horizontal;
Si Vecteur.y > 0 Alors
Sens positif;
Si Vecteur.x < 0 et Vecteur.y == 0 Alors
Sens négatif horizontal;
Si Vecteur.y < 0 Alors
Sens négatif;

Dans un autre article j’utiliserais ce petit système et vous expliquerais comment le moteur décide de l’ordre pour lire les points du dessin fraîchement réalisés par vous ou moi dans l’éditeur 🙂 Grâce à ça, et à l’aide d’une autre donnée, les secteurs et les ajouts aux secteurs sont créés de manière cohérentes.