Hallo, ich nutze aller Widererwarten Pixi.js um ein Spiel, welches ich bereits einmal angefangen hab neu zu entwickeln. Mein Ziel ist es mehrere Objekte über den Bildschirm bewegen zu lassen.
Zum Grundverständnis einmal Pixi erklärt: Es gibt die Funktion update(), in der die Spiele Logik ausgeführt wird. Diese Funktion wird im Loop ausgeführt, pro Sekunde 30 mal, was eine stabile Framerate zur Folge haben soll. Jetzt möchte ich diese Funktion nutzen ( In der ja eben die Logik des Spiels rein soll, um meine Objekte zu bewegen.
In meinem Beispiel sind es jetzt 14 Objekte, die sich alle zu einer Richtung bewegen sollen, allerdings soll jedes Objekt mit einer Verzögerung zum anderem starten. Da verstehe ich einfach nicht, wie ich der update function das mitteilen soll. Zur Verdeutlichung, genau so:
Das hier ist ein älterer Versuch, mit einer anderen Engine:
function levels() {
level++;
allLevels();
var speed = 0.1;
var nrBloons = 14, intv = 500;
function getDuration(v, x1, y1, x2, y2) {
var t = Math.hypot(x2 - x1, y2 - y1) / v;
return t;
}
for (let h = 0; h < nrBloons; h++) {
//bloon hinzufügen
setTimeout(function () {
$('canvas').addLayer({
type: 'image',
name: 'bloon' + h,
data: {
bloonType: 0
},
groups: ['bloons', 'redBloons'],
source: 'img/redBloon.png',
x: mapValues[0].x,
y: mapValues[0].y
});
let idxAni = 1;
while (mapValues[idxAni]) {
//bloon animieren
$('canvas').animateLayer('bloon' + h, {
x: mapValues[idxAni].x,
y: mapValues[idxAni].y
}, getDuration(speed,
mapValues[idxAni - 1].x, mapValues[idxAni - 1].y,
mapValues[idxAni].x, mapValues[idxAni].y), 'linear');
idxAni++;
}
}, intv * h);
}
}
Alles anzeigen
Dieser hat auch funktioniert, war aber aufgrund der Engine ineffizient. Da die neue Engine ganz anders funktioniert, muss die Logik nun wohl auch anders aufgebaut sein. Aber wie? Kann mir da einer helfen?