Discussion :

[Gaulouis]

Bonjour,

Je souhaite projeter une courbe de Bezier de 3 dimension (x,y,z)

J'ai essayé de projeter les points de contrôles pour dessiner ensuite la courbe en 2D mais j’obtiens des distorsion.

Savez vous comment déterminer les points de contrôles de la projection d'une courbe de Bezier en 3D ?

J'ai fais une petite vidéo pour illustrer la "distorsion" de la courbe verte

Je cherche donc à déterminer les point de contrôles qui me permettront d'obtenir la courbe rouge.

D'avance, merci de votre aide

[LittleWhite]

Bonjour,

Il n'y aucune raison que la formule ne fonctionne pas, sachant que ce n'est qu'une interpolation (non linéaire certes). Êtes vous sur que vos quatres points (points de départ/fin + point de contrôle) n'ont pas du tout été décalé à cause de la transformation ?

[Gaulouis]

Je suis sur que mes points de contrôles sont juste par ce que ce sont les même points.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
	context.strokeStyle = "#000000";// triangle
	context.beginPath();
	context.moveTo(vec1.data[0], vec1.data[1]);
	context.lineTo(vec2.data[0], vec2.data[1]);
	context.lineTo(vec3.data[0], vec3.data[1]);
	context.stroke();
 
	context.strokeStyle = "#00FF00";// courbe
	context.beginPath();
	context.moveTo(vec1.data[0], vec1.data[1]);
	context.quadraticCurveTo(vec2.data[0], vec2.data[1], vec3.data[0], vec3.data[1]);
	context.stroke();

Je suis également sûr que la courbe rouge (segmentation) est juste car sont sommet est au centre du triangle.

PS: J'vais faire un essai avec une bezier cubic au lieu d'un quadratic

[LittleWhite]

Sachant que le triangle n'est plus équilatéral, cela me semble assez logique comme résultat. Enfin, j'ai vraiment du mal à voir s'il y a vraiment un soucis ou non. Pourquoi le Bezier devrait être pareil que la courbe rouge ?

[Gaulouis]

Tout d'abord, merci LittleWhite pour l’intérêt que tu porte a mon problème

Je voudrais afficher une courbe (quadratique) de Bezier en 3D avec une perspective.

• 1er technique segmenter la courbe en plusieurs lignes (polyline) : c'est ma courbe rouge
• 2eme technique projeter les points de contrôles : c'est ma courbe verte.

Code :

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

Pourquoi le Bezier devrait être pareil que la courbe rouge ?

C'est une hypothèse que j'ai posé (d'après les sources de Five3D : function curveToSpace()). Après avoir essayé je me rend compte que l'hypothèse est fausse même approximativement (la distorsion est encore plus flagrante quand que je fais pivoter la courbe de haut en bas)

Je cherche une méthode pour déterminer la courbe de Bezier Bxy'(t), la projeté de la courbe de Bezier Bxyz(t) en 3D sur un plan 2D, définie par des point de contrôles.
En plus, je dois conserver la continuité(la tangente aux points de contrôle) car le but est d'afficher des polices de caractère en 3D.

Je ne trouve rien sur internet à ce sujet. Tout le monde parle de courbe Nurbs en 3D (Je dois faire fausse route, ou alors je suis pionnier). Mon but est d'afficher du texte en 3D dans un Canvas HTML(je dois utiliser des courbes cubic et quadrtic). Pour ça j'ai décider de pré-calculer les chemins vectoriel des police selon plusieurs angle/perspective et ainsi avoir une table de font en perspective (pour des raison de performance, mais j'essayerai quand même les calcule a la volé).

Bref, je cherche une méthode pour déterminer les points de contrôles

Cordialement,

Edit:
Je vais essayer de convertir ma courbe quadratique de Bezier 3D en courbe cubique de Bezier 2D, le problème c'est que je n'ai pas la conviction que le point à t=0.5 soit aussi a t'=0.5 sur ma nouvelle courbe on verra bien )

[LittleWhite]

Comment est réalisée la projection ?
Vous n'avez pas les points de contrôle de votre courbe ?

J'avoue avoir du mal à vous suivre.

[Gaulouis]

J'avoue avoir du mal à vous suivre.

Pour faire simple. Je possède une courbe de Bézier rationnel(sur un plan) définie sur 3 dimensions. Je cherche à déterminer l'équation polynomial de sa projection.

Comment est réalisée la projection ?

J'ai réalisé la projection en javascript. Je vous ais mis en pièce jointe les source (math.js, geom.js, graphics.js sont mes bibliothèque. graphics.js défini mes objets principales : Projector, Display.Camera, Display.Viewport, Display.Perspective, Display.Scene, Display.Object)

Le fichier index.html :
-lance le rendu depuis : projector.project(ctx);
-défini les point de contrôles de la courbe 3D

Code :

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

1
2
3
4
5
6
7
	var graphics_path = new Display.Graphics.Path();// courbe de Bézier rationnel définie sur 3 dimensions
			graphics_path.moveTo({x: , y: , z: });
			graphics_path.curveTo({x: , y: , z: }, {x: , y: , z: });
		var object = new Display.Object({// Comportement temporaire
			points: [{x: -1*scale, y: -1*scale, z: 0*scale}, {x: -1*scale, y: 1*scale, z: 0*scale}, {x: 1*scale, y: 1*scale, z: 0*scale}, {x: 1*scale, y: -1*scale, z: 0*scale}],// le carré,
			paths: [graphics_path]// la courbe / le triangle
		});

bezier_3d.zip

Mon but est de calculer les points de contrôles qui me donne la courbe rouge.

PS: J'ai utilisé Gimp pour afficher une courbe de Bézier de degrée3
Toute aide serrai la bienvenue

[Gaulouis]

Je ne sais pas si j'ai réussit a me faire comprendre ... C'est vrai que c'est un sujet pointu et je ne maîtrise pas tout le vocabulaire de ce domaine. (Par exemple polyline au lieu de polygone, segmentation au lieu d'interpolation etc...

Bref, j'y vais en tâtonnant. Si il y a des personnes qui on la même problématique je vous dévoile mes résultats:
Pour des petites courbe (comme les glyph) je peu approximer la courbe en projetant ces point de controles (Mon code de départ)

Code :

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

1
2
3
4
5
6
7
8
9
10
Pour les grande courbe quadratique (non rationnel), Il est possible de l'approximer par une courbe de degré supérieur en résolvant un système à 5 équation pour trouver ses points de contrôles:
B(t1) en fonction de t et de P1, P2
B(t2) en fonction de t et de P1, P2
B(t3) en fonction de t et de P1, P2
B'(t=0) la tangente au point 0
B'(t=1) la tangente au point 1
Où B est une courbe de Bézier Cubic et B' sa dérivé; B(t1), B(t2), B(t3) sont des points arbitraire sur la courbe où t1, t2, t3 ne sont pas connu
5 équations, 5 inconnues (P1.x, P1.y, P2.x, P2.y et t)
 
Après 5/6 feuille de calculer j'ai du faire une erreur et je n’obtiens pas le bon résultat. Mais ca c'est un autre problème

[LittleWhite]

Cela me semble logique, pour la projection des points de contrôle. Désolé, j'ai été plusieurs perdu (je ne maîtrise pas spécialement ce domaine).
Bonne continuation.

[LeGreg]

Tu pars du principe que la projection d'une courbe de Bézier (polynomiale) en 3d vers 2d via projection conique reste une courbe de Bézier (polynomiale).. Mais c'est loin d'être garanti. Déjà tu remarqueras que la projection conique n'est pas linéaire/affine !

Tu auras peut-être plus de chance en projetant les points de contrôle d'une courbe de Bézier en coordonnées homogènes (4D : X,Y,Z, homogène), vers coordonnées homogènes (3D : X', Y', homogène). tu fais ensuite l'interpolation dans cet espace et tu obtiens le point final (X'', Y'') en divisant par la coordonnée homogène. Mais ce n'est qu'une supposition de ma part (je n'ai pas fait les maths dans ma tête).