Discussion :

[stephane78l]

Bonjour, j'ai une sinusoide dans le plan z=5,qui s'etend de y=0 à y=-2 et dont le milieu est la droite y=-1 et je voudrais faire une rotation autour de cette droite y=-1 et z=5 qui est le milieu de la sinusoide.
pour le moment je n'y arrive pas avec three.js.est ce que c'est possible avec three.js? j'ai la build r71 de three.js

ma sinusoide est une line qui se dessine bien dans le plan z=5.
mais j'ai essayé plusieurs fonctions et elle semble faire une rotation autour de l'axe des x (y=0 z=0) au lieu de y=-1 et z=5, son milieu.
est ce qu il aurait mieux valu faire une mesh au lieu d'une line? c'est possible avec three.js ou aurait il mieux valu faire celà avec webGL?

[p3ga5e]

Salut ! Une sinusoïde est une courbe, tu ne peux que l’approximer par échantillons de sommets de lignes (ou polygones ?) , je connais pas ton but mais quel est l’intérêt d’échantillonner ta courbe en sommets et quel est l’intérêt d’utiliser le pipeline géométrique pour rendre une courbe ayant une fonction trigonométrique hyper simple ?

Pourquoi ne pas utiliser un simple pixel shader come ceci : https://www.shadertoy.com/view/XtfXW8

Sinon Three.js possèdent 2 méthodes pour orienter un Object3D :

• les angles d’Euler
• le quaternion qui est, en gros, un axe et un angle de rotation

As-tu tenté l'orientation avec un quaternion ?

[stephane78l]

en fait j'ai deux sinusoides que j'ai pu dessiner avec three.js ,d'equations y=sin(x)-1 z=5 et y=sin(x)+1 z=5,et je veux les mettre en rotation autrour de leurs axes les droites y=-1 z=5 et y=1 z=5 qui sont des axes paralleles à l'axe des x mais à chaque fois essai que j'ai fait ca me met ma sinusoide en rotation autour de l'axe des des x (y=0 z=0) au lieu de les mettre en roation aurour de y=-1 z=5 et y=1 z=5.
j'ai essayé sinline.rotateX(0.1); et sinline.rotation.x +=0.1; et ca les mets en roation autour de l'axe des x (sinline est un objet three.line) donc ce n'ai aps ce que je veux j'ai aussi essayé cette fonction:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
var rotObjectMatrix;
function rotateAroundObjectAxis(object, axis, axe, radians) {
    rotObjectMatrix = new THREE.Matrix4();
    rotObjectMatrix.makeRotationAxis(axis.normalize(), radians);
 
    // old code for Three.JS pre r54:
    // object.matrix.multiplySelf(rotObjectMatrix);      // post-multiply
    // new code for Three.JS r55+:
    axe.matrix.multiply(rotObjectMatrix);
 
    // old code for Three.js pre r49:
    // object.rotation.getRotationFromMatrix(object.matrix, object.scale);
    // old code for Three.js r50-r58:
    // object.rotation.setEulerFromRotationMatrix(object.matrix);
    // new code for Three.js r59+:
    object.rotation.setFromRotationMatrix(axe.matrix);
};
 
rotateAroundObjectAxis(sinline,new THREE.Vector3( 1, 0, 0),line5, 0.1); dans la fonction render

ou ici line5 est une ligne de l'axe y=-1 z=5
mais rien ne marche a chaque fois ca me mets mes sinusoides e nroation autour de l'axe des x (y=0 z=0) au lieu des 2 axes des deux sinusoides....

voila le probleme

le probleme n'est pas de dessiner mes sinusoides, ca s'est fait et ca marche,le probleme est de les mettre chacune en rotation autour de leur axe dans render() et non pas autour de l'axe des x

mes deux sinusoides sont dans le plan z=5.ce sont deux lignes 2d mais je veux les mettre en rotation 3d autour de leur axes y=-1 z=5 et y=1 z=5 qui sont deux axes paralleles a l'axe des x mais differents de l'axe des x et apparamment three.js ne voit les rotations que par rapport a un vecteur et non pas par rapport a un axe...

enfin j'ai utilise le terme axe a la place de droite, je voulais dire droite....(moi dans mon cas les deux droites y=-1 z=5 et y=1 z=5)

[p3ga5e]

Il semble que l’on ne parle pas le même langage Mathématique, tes définitions de droite ou d’axe de rotation sont très confuses.

Mais je pense avoir compris ton problème : tu souhaites que tes courbes tournent sur elles-mêmes,
tu dois donc exprimer ta courbe dans un repère locale y =sin(x) , z = 0 le déplacer L’objet3D en position (sinline.position.y=1 et sinline.position.z=5), et ensuite effectuer une rotation à chaque frame autour de l’axe { 1, 0, 0 } (sinline.rotation.x +=0.1)

[stephane78l]

merci beaucoup c'etait celà tu m'as resolu mon problème.Bonne journée...