最近上线了的基于HTML5的燃气3D培训仿真系统，以前的老系统是采用基于C++和OpenGL的OpenSceneGraph引擎设计的，OSG引擎性能和渲染效果各方面还是不错的，但因为这次新产品需求要求能运行多移动终端，多年前基于MFC封装OSG的老系统架构也实在该退休了，这年头找能维护MFC这种古董级GUI的靠谱人也非易事。

系统最终采用HT for Web的3D框架实现，项目中的程序员也很高兴有这样的机会终于摆脱维护MFC老系统的宿命，虽然大家都只有C++的开发经验，对HTML/CSS/JS并不熟悉，但毕竟HT for Web已经做了极佳的组件封装，CSS和DOM、包括跨平台的兼容性等棘手问题交给HT框架透明处理，程序员只需要掌握基本的js用法就可以快速上手，按HT的说法类比与关系数据库ORM(Object-relational mapping)映射框架，HT提供的是OVM(Object-View mapping)的框架，只需要基本的面对对象的js操作即可驱动控制各种View组件，当然对于明白原理的人依然可以不受框架约束自如操作HTML的View层。

系统主要分为设备介绍、门站组装、业务培训和模拟考核四大部分：

让我感觉比较爽的是控制3D图元部分，以前不同的设备类型得体力活的写一堆代码，才能好不容易的实现些旋转移动等操作控制，界面控件和3D模型之间的数据同步也得费不少劲，现在用js这种动态语言真是非常灵活，界面都可以非常方面的动态生成，加上HT for Web统一的数据模型自动就能处理好3D图元与控件之间的数据绑定和联动，我干起活来就像搭积木一样轻松，脑子里想的就是业务功能和业务数据，不用再去折腾不同组件如何同步这些数据，控件也无需做什么特殊扩展。

当然目前项目还仅仅是初版移植，业务功能上还未有太大创新，但就目前的进度我们已经体会到HTML5的开发快速性，js语言也不是想象中那么弱，团队控制好一定的编码规范后js的灵活性带来的开发进度提高还是非常显著，刚开始选型大家还在争论OSG基于C++和OpenGL的性能会优于JS和WebGL的方案，但现在回头看我们还是走对路子了，毕竟我们这样的企业应用也不需要像游戏级别的渲染和性能的要求，产品发布轻量，开发可快速迭代更是我们需要追求的路线。

以下是一段平板上的操作视频供参考 http://v.youku.com/v_show/id_XNzA0NjE2MjY0.html

基于HTML5的燃气3D培训仿真系统的更多相关文章

  1. 基于 HTML5 + WebGL 实现 3D 可视化地铁系统

    前言 工业互联网,物联网,可视化等名词在我们现在信息化的大背景下已经是耳熟能详,日常生活的交通,出行,吃穿等可能都可以用信息化的方式来为我们表达,在传统的可视化监控领域,一般都是基于 Web SCAD ...

  2. 基于 HTML5 WebGL 的 3D SCADA 主站系统

    这个例子的初衷是模拟服务器与客户端的通信,我把整个需求简化变成了今天的这个例子.3D 的模拟一般需要鹰眼来辅助的,这样找产品以及整个空间的概括会比较明确,在这个例子中我也加了,这篇文章就算是我对这次项 ...

  3. 基于VR技术的输电线路巡检仿真系统

    基于VR技术,搭建电力输电仿真系统用于培训,提供用户沉浸式学习体验.交互式操作体验,VR设备能够提供沉浸式真实感的模拟场景,使得输电线路巡检内容视觉化,跨越了空间和时间的限制,有针对性的解决传统输电运 ...

  4. 基于 HTML5 的 WebGL 3D 档案馆可视化管理系统

    前言 档案管理系统是通过建立统一的标准以规范整个文件管理,包括规范各业务系统的文件管理的完整的档案资源信息共享服务平台,主要实现档案流水化采集功能.为企事业单位的档案现代化管理,提供完整的解决方案,档 ...

  5. 基于 HTML5 WebGL 的 3D 风机 Web 组态工业互联网应用

    基于 HTML5 WebGL 的 3D 风机 Web 组态工业互联网应用 前言 在目前大数据时代背景之下,数据可视化的需求也变得越来越庞大,在数据可视化的背景之下,通过智能机器间的链接并最终将人机链接 ...

  6. 基于 HTML5 WebGL 的智慧楼宇可视化系统

    前言 可视化的智慧楼宇在 21 世纪是有急迫需求的,中国被世界称为"基建狂魔",全球高层建筑数量位居首位,所以对于楼宇的监控是必不可少.智慧楼宇可视化系统更多突出的是管理方面的功能 ...

  7. 基于html5顶部导航3D翻转展开特效

    基于html5顶部导航3D翻转展开特效是一款基于jQuery+HTML5实现的3D翻转网站导航菜单代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <header cla ...

  8. 基于 HTML5 Canvas 的 3D 渲染引擎构建生产管控系统

    前言 大家好,老郑我又回来了.这一期为大家带来一个非常好玩的 demo,我们制作一套自己的 3D 管道控制系统,运用了( http://www.hightopo.com )HT 的 Graph3dVi ...

  9. 基于 HTML5 + WebGL 实现 3D 挖掘机系统

    前言 在工业互联网以及物联网的影响下,人们对于机械的管理,机械的可视化,机械的操作可视化提出了更高的要求.如何在一个系统中完整的显示机械的运行情况,机械的运行轨迹,或者机械的机械动作显得尤为的重要,因 ...

随机推荐

  1. Redis常用命令汇总

    Redis HGET获取与字段中存储的键哈希相关联的值D:\web\JH2016\RedisV3.2\2MasterOpenAPI-15698\redis-cli.exe -h 127.0.0.1 - ...

  2. [算法导论]BFS @ Python

    class Graph: def __init__(self): self.V = [] class Vertex: def __init__(self, x): self.key = x self. ...

  3. WPF 触发器

    属性触发器:数据触发器:事件触发器

  4. Ecshop 最小起订量如何设置

    第一步,商品表必须有个字段  代表某个商品 最小订购数量->min_number 打开goods表   在最后字段添加一个min_number  tinyint类型 默认值为0  代表没有最小起 ...

  5. 连接的世界 - LTE时代产业趋势和战略分析

    连接的世界 - LTE时代产业趋势和战略分析 作者:华为有线技术公司李常伟 2014-09-22 信息产业发展解放的核心是这个世界连接的方式.由语音到数据.由通信到情感.由人的连接到物的连接.由“哑” ...

  6. spring mvc jsp运行不起来的问题

    spring mvc已经处理成让jsp运行,即: <bean class="org.springframework.web.servlet.view.InternalResourceV ...

  7. Android之NDK开发

    转自:http://www.cnblogs.com/devinzhang/archive/2012/02/29/2373729.html 一.NDK产生的背景 Android平台从诞生起,就已经支持C ...

  8. android-tools-adb

    sudo apt-get install android-tools-adbsudo apt-get install android-tools-fastboot

  9. <转载> 优秀程序员必备的23条好习惯

    转自 优秀程序员必备的23条好习惯 编程是一项聪明人玩的游戏,它既是对智力的考验,也是对习惯的考验,智力的好坏取决于父母的基因,人们无从左右,但习惯的好坏却是可以不断培养.一项由美国芝加哥大学国家研究 ...

  10. Ubuntu 配置AP总结

    1.这个是使用别人写的一个GUI来配置,:http://hi.baidu.com/lexiangtaotao/item/5d4e87f22db132c70cd1c86f 2.使用hostapd配置:h ...