jQuery "world"animation

Question

jQuery와 PHP를 사용하여 (가상 세계) 말할 수있는 "세계"를 만들고 있습니다. 먼저 어떻게 작동하는지 조금 더 나은 내 질문 이해하는 데 도움이 :

1. 사용자의 캐릭터의 위치가 데이터베이스, 사용자가 적절하게 꾸몄다에서 촬영을 (위치 값은 CSS 값은 - 왼쪽 위)
2. 사용자가 키보드의 화살표 키를 사용하여 움직일 수 있고 jQuery 애니메이션을 사용하여 캐릭터를 움직일 수 있습니다. 이것이 일어나는 동안 (각 화살표 누름에서) 사용자의 위치 값이 데이터베이스에 삽입되고 업데이트됩니다. 수 있도록하기 위해
3. 이 "글로벌"당신이 말할 수로, 값이 내가 알아 낸 위의 단계 AJAX

를 사용하여 각 사용자에 대해 한 번에 모두 업데이트해야 (사용자가 서로를 볼 수 있도록) . 그러나 다른 사용자의 위치가 이동되면 (화살표 키를 누르는 것을 의미) 해당 사용자를 보는 다른 사용자의 경우에는 이동 애니메이션이 표시되지 않습니다. 계속해서 캐릭터를 움직이면 jQuery 애니메이션을 사용하여 캐릭터가 완벽하게 움직이는 것을 볼 수 있습니다. 그러나 친구의 움직임을 보았다면 그는 "텔레포트"할 것입니다. 즉, 애니메이션이 없으면 한 위치에서 다른 위치로 이동할 것입니다. 자바 스크립트는 분명히 각 사용자 만 볼 수 있지만, 모든 사용자에게 모든 애니메이션을 보여줄 수있는 방법이 있습니까? 그래서 당신이 움직일 때, 당신의 친구는 단지 재 위치에 오르기보다는 당신이 움직이는 것을 보게 될 것입니다.

도움을 주셔서 감사합니다.

Answer 1

물론입니다. DB를 (ajax를 통해) 폴링하고 animate() 함수를 사용하여 각각의 새로운 스프라이트를 업데이트하기 위해 긴 폴링을 사용할 것을 제안합니다.

Answer 2

가 (죄송 별도의 대답이 아마 Dutchie의 대답에 주석으로 속해 있지만 나는 아직 "사방 언급"수) 동시에 화면에 모든 사용자를 표시하지 않는 경우

, 당신은 할 수 있습니다 예를 들어 각 사용자는 현재 사용자의 위치를 ​​사용하여 N 개의 사각형/픽셀 내의 모든 사용자를 찾아 해당 사용자 만 애니메이션으로 만드는 "animateNearbyUsers()"함수를 호출합니다. 이렇게하면 사용자 수가 증가함에 따라 프로세스의 성능 문제가 줄어들 수 있습니다.

Answer 3

대기 시간 때문에 완벽한 솔루션은 없지만 "충분 함"에 대한 정의에 따라 "충분히 좋은"솔루션이 있습니다.

가장 쉬운 방법은 각 서버 응답을 키 프레임으로 사용하여 애니메이션 대기열을 설정하는 것입니다.

서버에 대한 3 회 연속 폴링에서 a, b 및 c 위치를 얻으면 a에서 b로 애니메이션을 시작한 다음 위치 c를 얻고 b에서 c로 애니메이션을 대기열에 추가합니다 문자는 a에서 b로 첫 번째 애니메이션을 완료합니다.

이것은 (상대적으로) 단순해야하지만 서버가 이미 도착한 것으로 판단한 후에 다음 위치로 이동하기 시작하기 때문에 UI의 비용이 뒤쳐집니다.

더 어려운 방법은 사용자가 마지막으로 확인한 시간에 따라 이동하는 방향을 '추측'하려고하는 것입니다. 이것은 위치뿐만 아니라 방향 (그리고 아마도 속도)을 얻는 것을 포함하며, 당신이 틀린 것으로 추측 할 때 당신은 여전히 ​​점프를하게 될 것입니다. 그것은 더 많은 작업으로 부드럽게 할 수 있습니다. 이것은 본질적으로 대부분의 유명한 게임이하는 일이며, 올바르게하는 것은 까다로워집니다.