基于HTML5气3D仿真培训系统
根据最近的上线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图元部分,曾经不同的设备类型得体力活的写一堆代码。才干好不easy的实现些旋转移动等操作控制。界面控件和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仿真培训系统的更多相关文章
- 基于 Web 端 3D 地铁站可视化系统
前言 工业互联网,物联网,可视化等名词在我们现在信息化的大背景下已经是耳熟能详,日常生活的交通,出行,吃穿等可能都可以用信息化的方式来为我们表达,在传统的可视化监控领域,一般都是基于 Web SCAD ...
- 基于HTML5实现3D热图Heatmap应用
Heatmap热图通过众多数据点信息,汇聚成直观可视化颜色效果,热图已广泛被应用于气象预报.医疗成像.机房温度监控等行业,甚至应用于竞技体育领域的数据分析. http://www.hightopo.c ...
- 基于html5制作3D拳击游戏源码下载
今天给大家分享一款基于HTML5实现的3d拳王游戏源码.这款实例适用浏览器:360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. 不支持IE8及以下浏览器. 在线预览 ...
- 基于 HTML5 WebGL 的 CPU 监控系统
前言 科技改变生活,科技的发展带来了生活方式的巨大改变.随着通信技术的不断演进,5G 技术应运而生,随时随地万物互联的时代已经来临.5G 技术不仅带来了更快的连接速度和前所未有的用户体验,也为制造业, ...
- 基于HTML5实现3D监控应用流动效果
http://www.hightopo.com/guide/guide/core/lighting/examples/example_flowing.html 流动效果在3D领域有着广泛的应用场景,如 ...
- 基于 HTML5 的 3D 工业互联网展示方案
前言 通用电气(GE).IBM.英特尔等公司主推的“工业互联网”正在经历“产品-数据分析平台-应用-生态”的演进.这主要得益于 Predix 数据分析平台对工业互联网应用的整合能力.Predix 就像 ...
- 基于 HTML5 WebGL 的楼宇智能化集成系统(一)
前言 随着现代通信技术.计算机技术.控制技术的飞速发展,智能建筑已经成为现代建筑发展的主流.智能建筑是以建筑物为平台,兼备信息设施系统.信息化应用系统.建筑设备管理系统.公共安全系统等.集 ...
- 基于 HTML5 WebGL 的楼宇智能化集成系统(二)
前言 一套完整的可视化操作交互上,必不可少 2D/3D 的融合,在上期我们介绍了有关 3D 场景的环视漫游.巡视漫游以及动画效果,还包括了冷站场景.热站场景以及智慧末端的实现原理,本期主要 ...
- 基于 HTML5 WebGL 的医疗物流系统
前言 物联网( IoT ),简单的理解就是物体之间通过互联网进行链接.世界上的万事万物,都可以通过数据的改变进行智能化管理.ioT 的兴起在医疗行业中具有拯救生命的潜在作用.不断的收集用户信息并且实时 ...
随机推荐
- poj3252(数位dp)
题目连接:http://poj.org/problem?id=3252 题意:拆成2进制,在记录0和1的个数 求区间[a,b]中,满足传化成2进制后,0的个数>=1的个数的数字的个数... 分析 ...
- java设计模式_单例
public class Singleton { public static void main(String[] args) throws Exception { System.out.printl ...
- android学习---SeekBar和RatingBar
SeekBar 拖动条:拖动条和滚动栏类似,当是拖动条能够拖动滑块改变进度 RatingBar 星级评分条:星级评分条与拖动条相似 SeekBar特有的xml属性 android:thumb 指 ...
- PHP Html 弹窗,本页面弹窗子页面
echo '<script type=text/javascript>window.open("","name1","width=100, ...
- linux查看某个进程CPU消耗较高的具体线程或程序的方法
目前我们的监控,可以发现消耗较高CPU的进程(阀值为3个CPU),通过监控我们可以找到消耗较高CPU的进程号: 通过进程号pid,我们在linux上可以通过top –H –p <pid> ...
- PHP获取当前页面完整的URL
#测试网址: http://localhost/blog/testurl.php?id=5 //获取域名或主机地址 echo $_SERVER['HTTP_HOST']."<br> ...
- msyql在查询字段中的所有记录,不重复
mysql> select * from a ; +----+------+--------------+ | id | name | descri | +----+------+ ...
- NYOJ202 红黑树 【预购】
红黑树 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描写叙述 什么是红黑树呢?顾名思义,跟枣树类似.红黑树是一种叶子是黑色果子是红色的树. .. 当然,这个是我说的. .. ...
- Effective C++规定45 额外的代码
这部分是额外的代码博客,关键45术语思想已经实现. #include<iostream> using namespace std; template<typename T> c ...
- Android定位功能(二)
在前文Android定位功能(一)中,已经大致介绍了一下在Android平台中,和定位功能相关的类,并举例获取了位置信息.但是前文是基于Criteria定制了一个标准,通过getBestProvide ...