Javascript & images

[kev88000]

Bonjour à tous,

J'ai développé une classe permettant d'effectuer des rotations dans une image en utilisant les outils lié au balise 'canvas', la rotation fonctionne à merveille, cependant, j'ai des difficultés pour calculer la résolution qu'aura mon image après sa rotation de manière à ce qu'elle ne soit pas rogné, quelqu'un aurait t'il une formule magique qui a partir d'une taille d'image original + un angle de rotation saurait me retourner la nouvelle taille après rotation?

[Willpower]

Envoyé par kev88000

Bonjour à tous,

J'ai développé une classe permettant d'effectuer des rotations dans une image en utilisant les outils lié au balise 'canvas', la rotation fonctionne à merveille, cependant, j'ai des difficultés pour calculer la résolution qu'aura mon image après sa rotation de manière à ce qu'elle ne soit pas rogné, quelqu'un aurait t'il une formule magique qui a partir d'une taille d'image original + un angle de rotation saurait me retourner la nouvelle taille après rotation?

Si l'image de base est un rectangle et que tu connais son angle d'origine, tu dois pouvoir le faire facilement avec des sin/cos.

ex: mon image de base fait 60 de large et 80 de haut, je sais donc que les demi-diagonales(reliant les coins au centre) sont de longueurs racine(30²+40²) = 50.

Et l'angle initial est de atan(40/30) = 53.13°
Et l'autre coin(à coté, pas en face car il aura la même valeur)
atan(40/-30) = -53.13%

Vérifions :
50*Cos(53.13) = 0.6 = 30 largeur
50*Sin(53.13) = 0.8 = 40 hauteur

et pour le 2eme coin:
50*Cos(-53.13) = 0.6 = 30 largeur
50*Sin(-53.13) = 0.8 = 40 hauteur

max(30,30) = 30 largeur
max(40,40) = 40 hauteur

Supposons que tu rotes de 45% (un huitième de tour) l'angle devient donc 53.13 + 45 = 98.13%

50*Cos(98,13) = -7.07 largeur
50*Sin(98,13) = 49.49 hauteur

et pour le 2ème coin: -53.13 + 45 = -8.13%
50*Cos(-8,13) = 49.49 largeur
50*Sin(-8.18) = -7.07 hauteur

enfin tu reprends la valeurs max des 2 coins :
abs(max(-7.07,49.49)) = 49.49 largeur
abs(max(49.49,-7.07)) = 49.49 hauteur


enfin, si je ne me suis pas trompé, c'est que ça commence à faire loin le secondaire.

[Bovino]

Mouais... ceci dit, si tu veux pouvoir faire un tour complet de l'image, il faudra que ta balise canvas soit un carré de coté la diagonale de ton image...