以图形方式在浏览器上显示路径/路由

Question

我试图在浏览器上以图形方式显示路径/路由以供客户端查看。例如，基于txt或XML文件，包括方向。

<route> 
    <forward>4</forward> 
    <left>90</left> 
    <forward>5</forward> 
    <left>90</left> 
    <forward>2</forward> 
</route> 

或

F4,L90,F5,L90,F2 

一个简单的txt文件等效。

在这个例子中，路线是向前移动4个单位，向左转90度，再向前移动5个单位，向左转90度并向前移动2个单位完成。

这样的事情。箭头不一定要在那里，我只是为了清晰的方向而将它们吸引过来。如果能够动态地改变图像，比如能够显示跟随该路线的车辆，甚至在车辆跟随并完成路线的一部分时甚至将路线颜色改变为绿色，那将会更好。

我正在考虑使用Tomcat与java和jsp与javascript来做到这一点，但如果有更简单的选择，我不介意。有什么工具可以用在我的案例中吗？我之前没有做过任何接近此事的事情，请大家帮忙！

Answer 1

1. 学习如何通过java阅读.xml文件jsp - 谷歌搜索MVC模式，数据客体返回jsp页

2. 了解如何使用<canvas>画箭头：see good reference