10
votes

HTML5 Toile: Calculer un X, Y POINT AU POINT

Je développe une application de toile HTML5 et il implique la lecture d'un fichier XML décrivant la position des flèches, des rectangés et d'autres formes que j'ai besoin pour dessiner sur la toile.

Exemple de la disposition XML: < Pré> xxx

Si l'objet est tourné, il implique de calculer la position d'un point (appelé p la nouvelle position de l'objet après la rotation) lorsqu'elle est tournée autour d'un autre point (à gauche, en haut). Je tente de trouver une fonction générale / formule que je peux utiliser pour calculer ce point P mais mes mathématiques sont un peu faibles et je ne peux pas identifier quelle formule arc / tangente je suis destinée à utiliser.

< forte> Pouvez-vous m'aider à proposer une formule I puisse utiliser pour calculer le point P pour les rotations pouvant être à la fois positives et négatives?

 Entrez la description de l'image ici

dans l'exemple ci-dessus: point (14 446) est la gauche, le point de haut en haut (226, 496) est le milieu point de l'objet lorsqu'il n'est pas pivoté, le point = (gauche + largeur / 2, haut + hauteur / 2) et le point bleu est le point moyen lors de la rotation. Je sais comment caligner la longueur de la ligne entre points (14 446) et (226 496) mais pas comment calculer le point bleu x, la position Y - BTW: la longueur de cette ligne est identique à la ligne entre le point bleu et (14 446) xxx


0 commentaires

3 Réponses :


20
votes

C'est assez simple. En rotation autour de l'origine du système de coordonnées pour les coordonnées de THETA angle (x, y) change comme xxx

donc, tout ce dont vous avez besoin est de traduire le point de rotation sur l'un des points que vous avez. Permet d'écrire de manière plus simplifiée: (x1, y1) = (14 446) et (x2, y2) = (226, 496). Vous essayez de "faire pivoter" (x2, y2) autour (x1, y1). Calculez (DX2, DY2) dans un nouveau système de coordonnées avec l'origine à (x1, y1). xxx

tournez maintenant (des angles positifs sont dans le sens contraire des aiguilles d'une montre): < Pré> xxx

La dernière étape consiste à traduire les coordonnées du point de l'origine à (x1, y1) de retour à l'original (0,0); xxx

PS: lisez aussi ceci :) http://fr.wikipedia.org/wiki/rotation_matrix < / a> Et n'oubliez pas que la plupart des fonctions trigonométriques dans différentes langues de programmation traitent principalement de radians.

PPS: Et j'espère que je ne t'ai pas fait peur - Demandez si vous avez des questions.


0 commentaires

3
votes

Je pense que dans votre cas, vous devriez être capable de calculer cette position de rotation avec le système d'équations suivant: xxx

r la longueur du vecteur de rayon de yor ( len dans votre exemple).
Deg Angle en degrés, vous tournez vers, I.G 120 °
x et y les coordonnées de la position finale que vous recherchez.
angle est l'angle de rotation réel (en rad, pas de grades).
Angle0 est le point d'angle initial a été tourné vers une rotation relativement à l'axe des x. Nous devons précalculer en utilisant math.atan .

n'ai pas testé. Alors donnez-le un essai. Mais l'idée est comme ça - utilisez des fonctions trigonométriques.


1 commentaires

Il convient de mentionner une chose que vous devez mentionner lorsque vous traitez d'arctangent ... cela donnera le même angle lorsque (x, y) est dans I ou III quadrants et (x, y) est dans les quadrants II ou IV. La valeur correcte pour l'angle doit être choisie en fonction des signes de x et y.



-1
votes

1 commentaires

Notez que Les réponses de liaison uniquement sont découragées, les réponses doivent donc être le point final d'une recherche pour une solution (contre une autre halte de références, qui tendent à devenir obsolète au fil du temps). Veuillez envisager d'ajouter un synopsis autonome ici, en gardant le lien comme référence.