Probleme beim Rendern von sich bewegenden Punkten

[markusin]

Hi allerseits,

ich moechte gerne ein Array mit einer Liste von x und y koordinate durchiterieren und diese auf dem Bilschirm zeichen.
Das Problem dabei ist, dass ich eine Art sleep Funktion benoetige, andererseits sieht man nicht, wie sich das Objekt vom ersten bis zum letzten Punkt bewegt.

/**
* Simulation does an iteration over the entire moving objects array
*/
function simulate(mObj) {
  for (var i = 0; i < movingObjectStatus.length; i++) {
   paint(i);
  }
}

/**
* Paints the image item at the position of the item in the array at the passed index
*/
function paint(index) {
 var x = movingObjectStatus[index]["left"];
 var y = movingObjectStatus[index]["top"];
 var t = movingObjectStatus[index]["intervallSpan"];
 mObj._x = x;
 mObj._y = y;
 mObj.style.left = mObj._x + "px";
 mObj.style.top = mObj._y + "px";
 if(index < movingObjectStatus.lenght) {
  index += 1;
   window.setTimeout("paint("+(index)+")",10);
 }
}

ich sehe das objekt nur dann sich bewegen, wenn ich im debug mode bin.
Wie kann ich dieses Synchronisationsproblem loesen?

besten Dank

Markus

[JürgenB]

Hallo markusin,

wenn ich Dein Script richtig verstanden habe, dann rufst Du "paint" so oft auf, wie dein Vector "movingObjectStatus" Elemente hat, und das so schnell, wie möglich:

function simulate(mObj) {
  for (var i = 0; i < movingObjectStatus.length; i++) {
   paint(i);
  }
}

Die Funktion "paint" ruft sich selbst alle 10 ms mit einem um Eins erhöhten Argument wieder auf:

function paint(index) {
var x = movingObjectStatus[index]["left"];
var y = movingObjectStatus[index]["top"];
var t = movingObjectStatus[index]["intervallSpan"];
mObj._x = x;
mObj._y = y;
mObj.style.left = mObj._x + "px";
mObj.style.top = mObj._y + "px";
if(index < movingObjectStatus.lenght) {
  index += 1;
   window.setTimeout("paint("+(index)+")",10);
}
}

Willst Du das wirklich?

ich sehe das objekt nur dann sich bewegen, wenn ich im debug mode bin.
Wie kann ich dieses Synchronisationsproblem loesen?

Rufe am Anfang "paint(0)" einmal auf.

Gruß, Jürgen

PS Wozu benötigst Du mObj._x/_y?

[markusin]

Hi Juergen,

erstmals danke fuer die Antwort.

Also nochmals zu meiner Intentions:
ich moechte gerne ein moving object simulieren, wobei folgendes zu beachten ist:
wie du siehst befinden sich in dem Array drei attribute.
x und y sind klar, das dritte Attribut definiert den Zeitintervall (t_i) wann dieser Punkt besucht bzw. "gepainted" werden sollte.

Da Javascript assynchron arbeitet, ist das ganze etwas umstaendlicher, als mit eine Sprache, wo man einen Main thread hat und diesen schlafend setzt.

Das Setzen der property _x und _y ist ueberfluessig. Ignorier diese einfach.

waere dir echt dankbar wenn du mir fuer diese Problemvorstellung  Loesungsvorschlaege anbieten koenntest.

Gruesse und Dank

Markus

[wahsaga]

hi,

wie du siehst befinden sich in dem Array drei attribute.
x und y sind klar, das dritte Attribut definiert den Zeitintervall (t_i) wann dieser Punkt besucht bzw. "gepainted" werden sollte.
[...]
waere dir echt dankbar wenn du mir fuer diese Problemvorstellung  Loesungsvorschlaege anbieten koenntest.

window.setTimeout

gruß,
wahsaga

[JürgenB]

Hallo markusin,

ersetze im setTimeout einfach die 10 durch die gewünschte Zeit.
Hast Du meinen Vorschlag ausprobiert?

Gruß, Jürgen

[markusin]

Hi Juergen

Hast Du meinen Vorschlag ausprobiert?

Gruß, Jürgen

ich habs probiert. Jetzt funkt alles einwandfrei. Sogar wenn ich den 2 Parameter erhoehe funktioniert er wie gewuenscht.

Besten Dank nochmals

Markus