根据最近的上线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仿真培训系统的更多相关文章

  1. 基于 Web 端 3D 地铁站可视化系统

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

  2. 基于HTML5实现3D热图Heatmap应用

    Heatmap热图通过众多数据点信息,汇聚成直观可视化颜色效果,热图已广泛被应用于气象预报.医疗成像.机房温度监控等行业,甚至应用于竞技体育领域的数据分析. http://www.hightopo.c ...

  3. 基于html5制作3D拳击游戏源码下载

    今天给大家分享一款基于HTML5实现的3d拳王游戏源码.这款实例适用浏览器:360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. 不支持IE8及以下浏览器. 在线预览 ...

  4. 基于 HTML5 WebGL 的 CPU 监控系统

    前言 科技改变生活,科技的发展带来了生活方式的巨大改变.随着通信技术的不断演进,5G 技术应运而生,随时随地万物互联的时代已经来临.5G 技术不仅带来了更快的连接速度和前所未有的用户体验,也为制造业, ...

  5. 基于HTML5实现3D监控应用流动效果

    http://www.hightopo.com/guide/guide/core/lighting/examples/example_flowing.html 流动效果在3D领域有着广泛的应用场景,如 ...

  6. 基于 HTML5 的 3D 工业互联网展示方案

    前言 通用电气(GE).IBM.英特尔等公司主推的“工业互联网”正在经历“产品-数据分析平台-应用-生态”的演进.这主要得益于 Predix 数据分析平台对工业互联网应用的整合能力.Predix 就像 ...

  7. 基于 HTML5 WebGL 的楼宇智能化集成系统(一)

    前言       随着现代通信技术.计算机技术.控制技术的飞速发展,智能建筑已经成为现代建筑发展的主流.智能建筑是以建筑物为平台,兼备信息设施系统.信息化应用系统.建筑设备管理系统.公共安全系统等.集 ...

  8. 基于 HTML5 WebGL 的楼宇智能化集成系统(二)

    前言       一套完整的可视化操作交互上,必不可少 2D/3D 的融合,在上期我们介绍了有关 3D 场景的环视漫游.巡视漫游以及动画效果,还包括了冷站场景.热站场景以及智慧末端的实现原理,本期主要 ...

  9. 基于 HTML5 WebGL 的医疗物流系统

    前言 物联网( IoT ),简单的理解就是物体之间通过互联网进行链接.世界上的万事万物,都可以通过数据的改变进行智能化管理.ioT 的兴起在医疗行业中具有拯救生命的潜在作用.不断的收集用户信息并且实时 ...

随机推荐

  1. 谈Web应用系统的可维护性

           每一个软件开发人员都十分清楚, 当软件构建得越来越复杂时, 可维护性就成了一个很突出的问题. 如何在构造软件系统的过程中始终保持可控制的可维护性呢?          一. 整体组织   ...

  2. Java流的理解

    最近做了一下Socket编程,其中有socket.getInputStream和socket.getOutputStream的问题. 想传输文件,感觉应该用FileInputStream和FileOu ...

  3. python手记(52)

    python将信息加密进图片 从图片中解密信息 >>> runfile(r'K:\testpro\test1.py', wdir=r'K:\testpro') http://blog ...

  4. SVM-SVM概述

    (一)SVM背景资料简介 支持向量机(Support Vector Machine)这是Cortes和Vapnik至1995首次提出,样本.非线性及高维模式识别中表现出很多特有的优势,并可以推广应用到 ...

  5. jQuery中间each实施例的方法

    $.each()和$(selector).each()很阶段似,但它是不一样的. 前者可用于遍历数组或json对象 后者被设计成遍历jQuery对象 第一个是$.each()对,通常这么用 $.eac ...

  6. iOS随机颜色

    #import <UIKit/UIKit.h> @interface UIColor (RandomColor) +(UIColor *) randomColor; @end #impor ...

  7. jdk并发包 CopyOnWriteArrayList源代码分析

    CopyOnWriteArrayList是jdk1.5并法包里面用于处理高并发下.读多写少的情况下.减少锁等待的集合类.以下对该类实现做一个简要的分析 1,首先CopyOnWriteArrayList ...

  8. 【Web优化】Yslow优化法则(四)启用Gzip压缩

    Yslow的第4个经验法则指出:启用gzip压缩功能,能够降低HTTP传输的数据和时间,从而降低client请求的响应时间. 本篇是Yslow法则的第四个,主要包含三个方面的内容: 1.      什 ...

  9. 我的学习笔记_Windows_HOOK计划 2009-12-03 11:19

    一.什么是HOOK? "hook"这个单词的意思是"钩子","Windows Hook"是Windows消息处理机制的一个重要扩展,程序猿能 ...

  10. linux 流量监控 ---iptraf的安装及使用

    一.安装iptraf 我用的是centos,切换到root用户,执行 yum install -y iptraf 二.使用 1.直接输入iptraf,进入软件,按任意键继续 2.我主要是第二项和第三项 ...