pop up ajax pour localiser des lieu sur une carte

[misscasa2009]

bonjour à tous ,
j'ai une image carte, et je voudrai faire des popup en ajax sur certaines zone de la carte,
quelqu'un aurait il une idée sur le comment procéder, et ci vous avez des liens

merci bcp

[Matthieu_s]

Je n'ai pas compris si tu souhaites placer des points sur la carte ou si tu veux afficher uniquement une partie de la carte

1/ Si tu souhaites placer des points

Je suppose que tu connais les coordonnées Y et X du point que tu veux faire figurer sur la carte. Si c'est bien le cas, il te suffit de charger l'image de ta carte dans le popup, par exemple avec un positionnement absolute (pour aller au plus simple), et de places tes points dans la page avec positionnement absolute aussi, un z-index 2 (pour qu'il se place au dessus de l'image) et left et top respectivement égaux à X et Y.

Je l'avais fait sur un site, ça passe nickel.

2/ Si tu souhaites n'afficher qu'une partie de la carte

Dans ce cas je suppose que tu connais les coordonnées X et Y du coin supérieur gauche à partir duquel tu veux afficher la carte ?
Pour n'afficher qu'une partie de la carte, tu la places en background d'un élément HTML (par exemple le body si tu n'affiches que cela), et tu joues sur le background-position (par exemple background-position:-100px -100px; si tu veux afficher l'image à partir du point 100/100)

[forty]

si tu veux pouvoir définir des zones cliquables, tu peux simplement le faire avec les balises html <map> et <area>

[misscasa2009]

Merci Matt, ce que je veux c placer des points et au survol de la souris je veux afficher des popup en ajax, j'ai bien compris ta démarche, mais pour la réaliser c un peu difficile, tu n'aurais pas un petit bout de code pour commencer ?

Merci encore pour ta réponse

[Ukri]

Code: Tout sélectionner

<img src="image.jpg" border="0" usemap="#Map">
        <map name="Map">
          <area shape="circle" coords="112,162,29" onMouseOver="OuvrePopup('Zone1')" onMouseOut="FermePopup('Zone1')">
        </map>


Les fonctions OuvrePopup et FermePopup appellent tes fonctions AJAX bien entendu...

[misscasa2009]

merci Ukri pour ta réponse, pour la fonction AJAX, j'ai trouvé celle là:

Code: Tout sélectionner

   $(function () {
        $('.bubbleInfo').each(function () {
            var distance = 10;
            var time = 250;
            var hideDelay = 500;

            var hideDelayTimer = null;

            var beingShown = false;
            var shown = false;
            var trigger = $('.trigger', this);
            var info = $('.popup', this).css('opacity', 0);


            $([trigger.get(0), info.get(0)]).mouseover(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                if (beingShown || shown) {
                    // don't trigger the animation again
                    return;
                } else {
                    // reset position of info box
                    beingShown = true;

                    info.css({
                        top: -90,
                        left: -33,
                        display: 'block'
                    }).animate({
                        top: '-=' + distance + 'px',
                        opacity: 1
                    }, time, 'swing', function() {
                        beingShown = false;
                        shown = true;
                    });
                }

                return false;
            }).mouseout(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                hideDelayTimer = setTimeout(function () {
                    hideDelayTimer = null;
                    info.animate({
                        top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info.css('display', 'none');
                    });

                }, hideDelay);

                return false;
            });
        });
    });

elle marche pour un seul point, comment je peux faire pour la paramétrer pour toutes les points?