Koordinaten bei Mousemove speichert nicht

Xching

Erfahrenes Mitglied
Problem :

Ich kann die neuen Koordinaten nicht speichern, die ich gerade verschoben habe. Die Karte ist immer zu alte Koordinaten gesprungen , wenn ich zum 2.Mal die Karte verschiebe.


Ich habe hier Mouse Event Funktion geschrieben (mousedown,mousemove, mouseup)

1.Mal bei Mousedown

Nach dem ich gezoomt habe, möchte ich die Karte verschieben

Wenn ich die Mouse gedrückt halten habe ,wird die angefangen Koordinaten angezeigt.



1.Mal bei Mousemove

Wenn ich die Karte mit dem Mouse verschoben habe ,wird die differenten Koordinaten ermittelt.
ich habe die Karte hier nach oben verschoben.


1.Mal bei Mouseup

Wenn ich die Mouse losgelassen habe ,die Koordination wird angezeigt, wo die Mouse am Ende gerade ist.

2. Mal bei Mousedown

Wenn ich die Mouse gedrückt halten habe , die angefangen Koordinaten wird angezeigt.

2. Mal bei Mousemove (hier habe ich Problem)

Wenn ich gerade die Mouse auf die Karte bewegen habe, springt die Karte wieder auf die angefangen Koordinaten (1.Mal bei Mousedown)

ich hoffe, dass ihr mir weiter helfen kann.ich weiß es nicht warum?. ich danke euch schon mal voraus

Javascript:
function mousedown(e){


  movemap = true;

  startx = Math.round(e.clientX); // get x position of touch point relative to left
  starty = Math.round(e.clientY);
  statusdiv.innerHTML = "Status: mousedown<br> ClientX: "+ startx +"px "+starty+" Movemap = "+movemap+"";

  //e.preventDefault();

}
function mousemove(e){

    last = { x : 0,
            y : 0 };

     if (!e) {
         var e = window.event;
      }
    if (e.pageX || e.pageY){
        mouseX = e.pageX;
        mouseY = e.pageY;
    } else if (Math.round(e.clientX) || Math.round(e.clientY)){

        mouseX = Math.round(e.clientX) + document.body.scrollLeft + document.documentElement.scrollLeft;
        mouseY = Math.round(e.clientY) + document.body.scrollTop + document.documentElement.scrollTop;
    }

 

  // maximal,die Karte verschieben konnte
deltaXmax=Math.round ('.$width.'*scaleValue-'.$screenWidth.');
      deltaYmax=Math.round ('.$height.'*scaleValue-'.$height.'*'.$screenWidth.'/'.$width.');
 
// Berechnung dieffente Koordinaten

     distx  = mouseX - startx;
     disty = mouseY - starty;
   
    if(!movemap){

       return;
    }

     else if(movemap != false){

  
         if(distx<-deltaXmax) {
    
        distx=-deltaXmax;
        }
        if(distx>0){
            distx=0;
        }
    
        if(disty<-deltaYmax) {
            disty=-deltaYmax;
        }
        if(disty>0) {
            disty=0;
        }


  
       last.x += distx + last.x;
       last.y += disty + last.y;
   
       translate="translate("+last.x+","+last.y+")";
      transform=scale+" "+translate;
      //transform= translate;

      document.getElementById("layer1wMap").setAttribute("transform",transform);
      document.getElementById("layer2wMap").setAttribute("transform",transform);
      statusdiv.innerHTML = "Status: mousemove1<br> Resting x coordinate:"+last.x+"px"+last.y+"Movemap = "+movemap+"";
  
    }
}

function mouseup(e){

movemap = false;
endpunktx = e.clientX;
endpunkty = e.clientY;
statusdiv.innerHTML = "Status: mouseup<br> Resting x coordinate:"+ endpunktx +"px"+endpunkty+"Movemap = "+movemap+"";



}
 
Zuletzt bearbeitet:
Hi jeipack, ich habe mein Worldmap als SVG Grafik erstellt, die Pfade und Rechteck von einzelne Länder werden in Datenbank gespeichert. Ich habe hier mit g-Element die Gruppe von jede Pfade(Länder)->id=layer1wMap zusammengeschlossen und . Ich habe hier mit g-Element die Gruppe von jede Rechteck(Länder)->id=layer2wMap zusammengeschlossen .

upload_2015-6-11_9-2-6.jpeg
 
So ganz schnell als Test:
Javascript:
function mousedown(e){
  movemap = true;
  startx = Math.round(e.clientX); // get x position of touch point relative to left
  starty = Math.round(e.clientY);
console.log("startx: "+startx);
}
window.onmousedown = function(e) { mousedown(e) }
window.onmousemove = function(e) { mousedown(e) }
window.onmouseup = function(e) { mousedown(e) }
Wenn ich nun die Maus bewege bekomme ich immer die aktuelle x-koordinate.
Auch wenn ich die Taste gedrückt halte und herum ziehe bekomme ich keine alte Koordinate.

Kannst du den Fehler auf http://jsfiddle.net/ reproduzieren?
 

Neue Beiträge

Zurück