Discussion :

[siu.territories]

Bonjour à tous,

Je voudrais faire un site constitué de :

1- un fond qui comprend une carte du monde : elle est visible partiellement, se déplace (interpolation classique) et est manipulable par l'internaute de manière à ce qu'il puisse se déplacer dedans (drag&drop).

2- sur cette carte se trouvent des vignettes cliquables qui donnent lieu à leur agrandissement (lien vers une autre image du scénario) - les vignettes doivent aussi suivre le mouvement de la carte...

Les premières étapes de ce scénario sont réussies, excepté le fait d'accrocher les vignettes à la carte : lorsque l'internaute 'drag&drop' la carte, il faudrait que les vignettes suivent le mouvement de la carte, de manière à ce qu'elles se trouvent toujours sur le même endroit de la carte...

voir en PJ:
- screen1 = vignettes bien placées sur la carte
- screen2 - vignettes mal placées après drag&drop sur la carte

Auriez-vous une idée ?

merci merci !!!!!

siu

[Romain D.]

Au drop, tu peux repositionner tes images en fonction des nouvelles coordonnées x et y de ta map.

Tu définis 2 variables tmpX et tmpY qui représente la position de ta carte avant le déplacement puis tu fais :

Code :

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

1
2
image.x = image.x + (carte.x - tmpX);
image.y = image.y + (carte.y - tmpY);

[siu.territories]

c'est très gentil mais je m'y connais très mal en code flash - j'avais repiqué un code juste pour faire le drag&drop sur la carte...
crois-tu pouvoir me donner un exemple de ce que ça donne en combinant avec le code appliqué aux vignettes ?
peut-être que le code ci-dessous n'est pas le plus adapté ?

mille mercis!

"map_mc" designe l'occurrence du symbole clip de la carte

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
stop()
 
map_mc.addEventListener(MouseEvent.MOUSE_DOWN, dragArea);
map_mc.addEventListener(MouseEvent.MOUSE_UP, dropArea);
 
function dragArea(e:MouseEvent):void{
    var bounds:Rectangle = new Rectangle(
stage.stageWidth - map_mc.width,
stage.stageHeight - map_mc.height,
map_mc.width - stage.stageWidth,
map_mc.height - stage.stageHeight
);
    map_mc.startDrag(false, bounds);
}
 
function dropArea(e:MouseEvent):void{
    map_mc.stopDrag();
}

[siu.territories]

...
bon je repose la question différemment : comment définit-on le code d'une variable pour créer : "2 variables tmpX et tmpY" ?

merci de votre aide précieuse....
je rame...
...
...

[Romain D.]

déclaration de variables :

Code :

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

1
2
var tmpX:int;
var tmpY:int;

[siu.territories]

J'ai donc placé le code ci-dessous -
résultat :
- la vignette image (frida_mc) censée suivre le drag&drop de la carte se positionne à un autre endroit que celui que j'ai défini, coimme si le code lui avait indiqué d'autres coordonnées...
- la vignette-image ne suit pas le drag&drop de la carte (map_mc)... elle reste statique...

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
21
22
23
stop()
 
map_mc.addEventListener(MouseEvent.MOUSE_DOWN, dragArea);
map_mc.addEventListener(MouseEvent.MOUSE_UP, dropArea);
 
function dragArea(e:MouseEvent):void{
    var bounds:Rectangle = new Rectangle(
                                stage.stageWidth - map_mc.width,
                                stage.stageHeight - map_mc.height,
                                map_mc.width - stage.stageWidth,
                                map_mc.height - stage.stageHeight
                           &nbsp:wink:;
    map_mc.startDrag(false, bounds);
}
 
function dropArea(e:MouseEvent):void{
    map_mc.stopDrag();
}
 
var tmpX:int;
var tmpY:int;
frida_mc.x = frida_mc.x + (map_mc.x - tmpX);
frida_mc.y = frida_mc.y + (map_mc.y - tmpY);