Rotation marqueur google maps

[xanthius]

Bonjour à tous,
je viens faire appel à vous pour m'aider à résoudre un petit souci, tout rikiki haha !
Cela concerne la rotation d'un marqueur.
J'ai fouillé la doc et j'ai pu trouvé la rotation que j'ai tenté d'appliqué

Code :

var image = {
   url: 'images/map/avion.png',
   rotation: 45,
   size: new google.maps.Size(16, 30),
   origin: new google.maps.Point(0, 0),
   anchor: new google.maps.Point(7, 7)
 };

Le hic c'est qu'il semblerait que cela ne soit disponible que pour les symboles, quelqu'un aurait une astuce ?

Pourquoi la rotation ?
je désire afficher la position de l'avion du joueur durant le vol, ça c'est bon, le seul problème (d'ordre esthétique) est que le marqueur, en l'occurrence, un petit avion, reste à la verticale

Je pensais utiliser la rotation pour l'orienter vers le bas, à savoir la destination.
Quelqu'un a déjà été confronté à ce souci ? y a t'il une solution ?
Merci

[Xenos]

Salut,

chez Google-sauce-maison-JS je ne sais pas, mais tu as animateMotion en SVG qui permet d'animer le déplacement d'un objet (l'avion) le long d'un chemin (trajet) avec la possibilité que l'objet soit automatiquement tourné pour suivre ce chemin (il "tangente" le chemin).

Je ne sais pas comment ils ont traduis ce comportement dans leur modèle JSON.

[xanthius]

Wahou super !!!!!
je vais voir si j'arrive à la comprendre et à le mettre en place avec maps ^^
Merci

[niahoo]

Au pire du pire tu peux générer l'image dynamiquement en faisant la rotation en PHP ou javascript.

var image = {

   url: 'map-image.php?source=avion.png&rotation=45',

   // ...

 };

En javascript avec un petit canvas puis un export vers du png.

Mais bon il y a surement moyen de le faire dans la doc

[xanthius]

Ah je n'y avais pas pensé à cette astuce :o
Il y a bien dans le doc des informations quant à la rotation mais ça ne fonctionne pas pour une image ..

Le post de Xenos m'intéresse vraiment car l'animation est vraiment top ! Le seul problème est que je ne vois pas trop comment mettre en place ..

[Xenos]

Je n'irai pas sur une solution où le serveur fait la transformation car cela rajoute une entrée à sécuriser pour un détail d'esthétique client (si je passe "source=../.htaccess" ou "rotation=NULL", que se passera-t-il? Et si j'appelle cette page en boucle/l'insère en tant qu'avatar sur un forum ce qui fera des milliers d'appels à cette page?).

A la limite (à voir), le canvas coté client, pourquoi pas (avec une BlobUri ou dataUri suivant le cas).

C'est du SVG, donc pour l'appliquer à ton cas, cela me semble difficile (ou alors, il faut que tu travailles dans du SVG, dont le fond est une carte PNG raster / la carte Google par exemple).

Sinon, où était-ce marqué dans ta doc, pour la rotation? C'est peut-être:
• Une doc dépréciée et l'attribut a été renommé (rotate?)
• Une doc dépréciée et l'attribut a changé de type ("45deg"?)
• Une doc d'actualité dans laquelle une déclaration préalable t'as échappée (genre new gnagna({withRotation: true})

[xanthius]

Alors pour le doc j'ai trouvé cela :
rotation
Type: number
The angle by which to rotate the symbol, expressed clockwise in degrees. Defaults to 0. A symbol in an IconSequence where fixedRotation is false is rotated relative to the angle of the edge on which it lies.

Le lien :
https://developers.google.com/maps/docum...nce#Symbol
En repartant dessus je constate bien que ce n'est que pour les symboles, moi qui pensais que ça pouvait s"utiliser pour des images ..

[niahoo]

...

Ben tu met du cache. Ou tu les génère toutes à l'avance.

[Xenos]

Dans ce cas, oui, c'est une alternative... Bon, après "images/map/avion-000.png"..."images/map/avion-360.png" ca va faire beaucoup ^^ mais c'est une alternative vite réglée.

[xanthius]

Bonjour, du coup le mieux à faire serait quoi ? :o