Sprite Bewegen Verwendung Eingabekoordinaten

Question

\t \t \t \t /************ON RECEIVING MESSAGES VIA WEBSOCKET FROM THE SERVER********/ 
 
\t \t \t \t ws.onmessage = function(event) { 
 
\t \t \t \t \t var mySpan = document.getElementById("messageGoesHere"); 
 
\t \t \t \t \t var mySpan2 = document.getElementById("messageGoesHere2"); 
 
\t \t \t \t \t var str = event.data; 
 
\t \t \t \t \t //var temp = new Array(); 
 
\t \t \t \t \t //temp = str.split("\\|"); 
 
\t \t \t \t \t /***********SPLITS THE RECEIVED MESSAGE**************** 
 
\t \t \t \t \t *********AND STORES THE VALUE IN THE VARIABLES*********/ 
 
\t \t \t \t \t if((str.localeCompare('connected'))==0) 
 
\t \t \t \t \t \t { 
 
\t \t \t \t \t \t \t document.getElementById("connection").innerHTML='Connected'; \t 
 
\t \t \t \t \t \t } 
 
\t \t \t \t \t else if((str.localeCompare('closed'))==0) 
 
\t \t \t \t \t \t { 
 
\t \t \t \t \t \t \t document.getElementById("connection").innerHTML='No connection'; 
 
\t \t \t \t \t \t } 
 
\t \t \t \t \t else{ 
 
\t \t \t \t \t \t \t var array = str.split('|'); 
 
\t \t \t \t \t \t \t mySpan.innerHTML = parseInt(array[5]) 
 
\t \t \t \t \t \t \t mySpan2.innerHTML = parseInt(array[6]); \t 
 
\t \t \t \t \t \t \t draw(parseInt(array[5]), parseInt(array[6])); 
 
\t \t \t \t \t } 
 
\t \t \t \t };

I auf einem Roboter Spiel arbeite und ich bin mit Phaser library.My Anforderung ist die XY-Koordinaten auf Roboter (Sprites), und es sollte nach bewegen zu übergeben das koordiniert ohne Geschwindigkeit oder Geschwindigkeit. Ich verwende folgenden Code zum Bewegen des Roboters. Jetzt möchte ich es auf der Karte mit den eingehenden Koordinaten verschieben. Also, bitte gib mir ein paar Vorschläge.

// The following code is for the robot movement \t 
 
    \t 
 
    \t // This is initial velocity 
 
    \t player.body.velocity.x = 0; 
 
     player.body.velocity.y = 0; 
 

 
     if (cursors.left.isDown) 
 
     { 
 
      player.body.velocity.x = -200; 
 
     } 
 
     else if (cursors.right.isDown) 
 
     { 
 
      player.body.velocity.x = 200; 
 
     } 
 

 
     if (cursors.up.isDown) 
 
     { 
 
      player.body.velocity.y = -200; 
 
     } 
 
     else if (cursors.down.isDown) 
 
     { 
 
      player.body.velocity.y = 200; 
 
     }

Answer 1

OK so wie es aussieht wird Ihre Frage damit zusammen, wie die Sprite in der Spielwelt zu positionieren, mit Koordinaten aus einer externen Quelle erhalten - über das Internet. Dies ist ein Problem in jedem Multiplayer-Spiel. Wie positionieren Sie Ihre Spieler im Grunde, wenn die Positionen Ihres Servers von Natur aus veraltet sind, was Ihre Benutzer tun? Here is a really good article from Valve on the subject. Sie müssen nicht alles für ein Einzelspieler-Spiel tun, das nur eine Position von einer Websocket aus setzt. Allerdings würde ich empfehlen, die letzten 1 oder 2 last_positions Koordinaten speichern und lerping zwischen ihnen, wie Sie den nächsten Wert erwarten koordinieren.

Wenn Ihre Frage mehr ist damit zusammen, wie die Koordinaten von externen Skript in Ihr Phaser Spiel zu bekommen, dann sieht es aus wie Sie gerade Ihre WebSocket Daten in eine HTML-div speichern? Wenn dies der Fall ist, ist Phaser immer noch JS und kann mit dem DOM interagieren. Greifen Sie in Ihrer update() Funktion auf das Element im DOM zu und erhalten Sie Ihren Wert.

Kann nicht sagen, dass ich, obwohl dieser Ansatz würde empfehlen. Ich wette, dass das Schreiben/Abrufen aus dem DOM eine I/O-Strafe (vielleicht sogar eine Art von Rendern) nach sich ziehen wird. Stattdessen würde ich empfehlen, das Spiel-Skript vor dem Websocket-Skript zu laden, um eine globale -Funktion in Ihrem Spiel anzuzeigen und diesen Rückruf von Ihrem Websocket-Skript aus zu verwenden. Dann können Sie Ihre 1 oder 2 last_positions, und in update() lerp zwischen diesen Positionen aktualisieren.

//game.js, load before webSocket 
var game = ... //global variable 
//state 'PlayGame' is where your robot moves 

//webSocket.js 
ws.onmessage = function(event) { 
    ... 
    game.states.state.PlayGame.updateCoordinates(x,y); 
}