近年来，人们对水资源的重要性的认识逐步提高，世界各国在水资源开发领域中的投入也在日益增加，极大地促进了船舶技术和船舶制造业的发展。此外，世界经济全球化和贸易自由化也必将进一步推动航运业的繁荣。作为水资源开发和运输的主要工具，舰船正朝大型化和高速化方向发展，这势必导致船舶操控较以往更为复杂，海上交通越来越频繁，航道中船只密度越来越大，也给船舶操纵带来了巨大压力。这些状况均对确保船舶安全航行提出了更高的要求。

选择用HTML5来进行船舶避碰系统的前端开发是有理由的。HTML5本身是由W3C推荐出来的，它的开发是通过谷歌、苹果，诺基亚、中国移动等几百家公司一起酝酿的技术，这个技术最大的好处在于它是一个公开的技术。换句话说，每一个公开的标准都可以根据W3C的资料库找寻根源。另一方面，W3C通过的HTML5标准也就意味着每一个浏览器或每一个平台都会去实现

HTML5的最显著的优势在于跨平台性，用HTML5搭建的站点与应用可以兼容PC端与移动端、Windows与Linux、安卓与IOS。它可以轻易地移植到各种不同的开放平台、应用平台上，打破各自为政的局面。这种强大的兼容性可以显著地降低开发与运营成本，可以让企业特别是创业者获得更多的发展机遇。比如你开发了一款HTML5的游戏，你可以很轻易地移植到UC的开放平台、Opera 的游戏中心、Facebook应用平台，甚至可以通过封装的技术发放到App Store或Google Play上，所以它的跨平台性非常强大，这也是大多数人对HTML5有兴趣的主要原因。

很早就有人设想，能不能“一次设计，普遍适用”，让同一张网页自动适应不同大小的屏幕，根据屏幕宽度，自动调整布局(layout)。2010年，Ethan Marcotte提出了”自适应网页设计“这个名词，指可以自动识别屏幕宽度、并做出相应调整的网页设计。这就解决了传统的一种局面——网站为不同的设备提供不同的网页，比如专门提供一个mobile版本，或者iPhone / iPad版本。这样做固然保证了效果，但是比较麻烦，同时要维护好几个版本，而且如果一个网站有多个portal(入口)，会大大增加架构设计的复杂度。

此外，HTML5的本地存储特性也给使用者带来了更多便利。基于HTML5开发的轻应用比本地APP拥有更短的启动时间，更快的联网速度，而且无需下载占用存储空间，特别适合手机等移动媒体。而H5让开发者无需依赖第三方浏览器插件即可创建高级图形、版式、动画以及过渡效果，这也使得用户用较少的流量就可以欣赏到炫酷的视觉听觉效果。

2. 研究的基本内容与方案

船舶碰碰是航运业内急需解决的重要问题，现代船舶避碰系统正在朝智能化、规范化和集成化方向发展。船舶智能避碰决策,有助于提高船舶航行的安全性,减少人为因素的影响和人的劳动量,对世界的航运业的发展有重要意义。本课题对船舶智能避碰进行可视化演示，考虑到系统的可维护性、开发的快捷性及跨平台性，采用HTML5技术来开发前端部分，实现船舶动态信息实时展示、轨迹回放等功能。通过对该课题的研究，进行一次综合运用所学理论和技能的训练，进一步提高分析问题和解决问题的能力。

本课题主要内容以及目标包括：
1.用户可以进行地图模块的选择以及船只的添加

2.展示两个或两个以上的二维船舶模型的动态移动效果
3.对船舶的动态信息如船舶方向、船舶速度和船舶轨迹等进行实时显示；
4.对多船会遇和避碰的情况进行效果演示；
5.对历史轨迹数据进行回放等。