Question

Je crée un rendu 3D HTML5 Canvas 3D, et je dirais que je suis devenu assez loin sans l'aide de oui, mais je rencontre un aspect showstopper. J'essaie d'implémenter la floraison de dos sur un cube à l'aide de certains calculs normaux. En outre, j'ai marqué cela comme WebGL, car il s'agit d'une question assez générale qu'il pourrait s'appliquer à la fois à mon étui d'utilisation et à une accélérée 3D-accélérée.

En tout cas, alors que je tournais le cube, j'ai constaté que les mauvaises visages sont cachées. Exemple:

Backface Culling Issue sur un cube

J'utilise les sommets suivants: https://developer.mozilla.org/fr/webl/webgl/Creatting_3d_Objects_uce_webgl#define_the_pube% 27s_vertices

La procédure générale que j'utilise est la suivante:

  1. Créez une matrice de transformation par laquelle transformer les sommets de cube

  2. pour chaque visage, et pour chaque point de chaque face, je les converties en Vec3s, etn les multiplier par la matrice faite à l'étape 1.

  3. I ALORCE LA SURFACE NORMALE DU FACE À l'aide de la méthode de Newell, puis obtenez un produit de points de cette valeur normale et composée Vec3, par exemple, [-1, 1, 1], car je ne pouvais pas ' Je pense à une bonne valeur à mettre ici. J'ai vu certaines personnes utilisent la position de la caméra pour cela, mais ...

  4. sautant de l'étape habituelle de l'utilisation d'une matrice de caméra, je tire les valeurs X et Y des vecteurs résultants à envoyer à mes remercers de la ligne et de mon visage, mais seulement s'ils ont un produit de point supérieur à 0. Je réalise C'est plutôt arbitraire que je tire, vraiment.

  5. Je me demande deux choses; Si ma procédure à l'étape 3 est correcte (elle n'est probablement pas), et si l'ordre des points que je dessine sur les visages est incorrect (très probable). Si ce dernier est vrai, je ne suis pas tout à fait sûr de la façon de visualiser le problème. J'ai vu des gens dire que les normales ne sont pas pertinentes, que c'est la direction de la ligne, mais ... il est difficile pour moi d'envelopper ma tête autour de cela, ou si c'est la source de mon problème.

    Cela n'a probablement pas d'importance, mais la bitriche que j'utilise est GL-Matrix:

    https://github.com/toji/gl-Matrix

    En outre, le fichier particulier de ma source open-source que j'utilise est ici:

    http://code.google.com /p/nanoblok/source/browse/nb11/app/Render.js

    Merci d'avance!

Était-ce utile?

La solution

Je n'ai pas examiné votre système entier, mais le "Vec3 maquillé" ne devrait pas être arbitraire; Il devrait être le vecteur "hors de l'écran", lequel (puisque votre projection est x , y , z ⟩ → ⟨ x , y ⟩) est supérieur à 0, 0, -1⟩ ou 0, 0, 1⟩ en fonction de la mainness et des axes de votre système de coordonnées. Vous n'avez pas de "matrice de caméra" explicite (qui est généralement appelée matrice de vue), mais votre caméra (vue et projection) est implicitement définie par votre projection étape 4!

Toutefois, notez que cette approche ne fonctionnera que pour les projections orthographiques, et non de perspective (considère une face sur le côté gauche de l'écran, face à la droite et parallèle à la direction de la vue; le produit DOT serait 0 mais il devrait être 0 mais il devrait être visible). L'approche habituelle, utilisée dans le matériel 3D réel, est de faire tout d'abord toute la transformation (y compris la projection), puis vérifiez si le triangle 2D résultant est dans le sens antihoraire ou dans le sens des aiguilles d'une montre, et gardez ou jetez-le en fonction de cette condition.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top