Animating Graphics with Dynamic Content

I am developing a website for my son's baseball team and want to provide a graphical display for parents to "watch" if they cannot attend the game in person. The static graphic portion will show the field. The dynamic part of it will show where each player is positioned, where the ball is hit to, and where the runners are on the bases. It will also show the roster for each team and the textual play-by-play and a scoreboard. The display should automatically update on a specified开发者_开发技巧 interval.

I am an IT Professional by trade, but have just recently gotten into web design on my own. I use Dreamweaver and PHP for my development and am pretty good at figuring out new stuff.

Can someone provide me some guidance on the best way to implement the task above?

Personally I would go for Node.js for a backend, Socket.IO for communication and Raphaël for the display. It would be portable across browsers and you could make all changes visible instantly on every connected client.