先上段视频，不是在玩游戏哦，是规规矩矩的电信网管企业应用，嗯，全键盘的漫游3D机房:


随着PC端支持HTML5浏览器的普及，加上主流移动终端Android和iOS都已支持HTML5技术，新一代的电信网管应用几乎一致性的首选HTML5，当然Flex和Silverlight的遗留系统依然存活着，如果不考虑移动终端，不考虑将来维护人员难找，不考虑需要承载成千上万的网元数量，不考虑公司员工的职业生涯前途，哪怕其各自父母adobe和ms都已弃之，其实Flex和Silverlight作为企业应用方案技术上还是可以的，还是能存活很多很多年。

但我作为程序员可是要考虑自己的职业生涯的，可能有人喜欢成为能维护CORBA或IBM大机那样的稀有物种得到高薪，我还是喜欢朝气蓬勃的技术氛围，我喜欢每天上Hacker News都能见到讨论我从事的技术的新鲜事，我喜欢有搞通用组件有Sencha和Kendoui可选择，搞图表有Highcharts可选择，搞2D拓扑和3D机房有Hightopo可选择，搞移动应用有JQuery Mobile可选择，每周末到徐家汇公园那个照的到太阳看得见湖色几乎成为我私人定制的木凳，打开平板好好通读这一周Web前端发送的一切新鲜事，是的我有JavaScript Weekly、HTML5 Weekly和Modern Web Observer可选择，我很庆幸自己活在这个HTML5时代，可以用一门javascript语言技术玩通用组件，玩Chart，玩拓扑，完3D，是的还可以玩后台NodeWeekly，再说了不成为稀缺动物，就玩HTML5不也照样拿高薪，有选择的条件下何苦让自己成为恐龙古董。

回到今天正题，随着去年后半年来IE11和Android浏览器支持WebGL之后，WebGL技术在我接触的行业领域已成燎原之势。什么？还得考虑支持OA老系统的IE678，Chrome Frame插件早就可以让IE678910跑WebGL了，更不用说HTML5的2D的Canvas。什么？性能问题，可看看HT for Web 跑数万网元的操作体验视频。

什么？兼容性问题，这些问题就交给各种框架来解决，HTML5的3D引擎非常多threejs是知名度较高的，但较臃肿大好几百k的包，什么功能都触及但都做不深入，动画引擎像玩具，做游戏引擎又缺碰撞检测，这点上不及后起之秀babylonjs，最早吸引我的是注意的是介绍babylonjs的这段话 I am a real fan of 3D development. Since I was 16, I spent all my spare time creating 3d engines with various technologies (DirectX, OpenGL, Silverlight 5, pure software, etc.). 这段话老让我郁闷的回忆自己16岁在干吗？

我喜欢babylonjs主要因为他专注游戏引擎的定位，同样企业应用我选择Hightopo的HT for Web 3D引擎，毕竟企业应用和游戏功能、性能、渲染效果等方面考虑的是不一样的，没有一个引擎能解决所有行业的所有问题，干活还得找最对口的工具，Hightopo的3D引擎包很小，核心3D引擎只有几十k，融合通用组件和2D的整体包也才200多k，另外HT的整体开发模式用同一个数据模型驱动了通用组件、2D拓扑组件包括3D引擎的组件，对于我做企业应用的Tree、Table这些和图形的联动是很重要的事情，这点做游戏的同学可能体会不到我们这些还得面对一大堆业务表格整体CURD同学的痛苦，另外Hightopo也具备必要的游戏引擎功能，例如全键盘导航操作功能，支持Mobile的Touch交互功能，基本的Collisions Detection碰撞检测。最后Hightopo毕竟专注电信行业，知道电信网管需要什么模块库，他能知道我等每天面对ODF/DDF/MDF/Shelf/Card/Port这些电信业务模型的痛苦点。见此视频

使用Hightopo还有很重要的一点就是HT提供了基于HTML5的可视化设计器，无需借助3ds max和maya这样的专业3D设计工具，直接HT 3D Designer通过页面就能进行3D建模，而动态的数据部分通过API的方式驱动生成模型和实时更新即可，最近的这些项目我们团队不需要美工都能完全由我们程序员自己搞定，当然要做漂亮贴图部分还是需要美工ps的帮助。

就像电信OSS和BSS越来越难清晰定界一样，2D和3D的应用也会如此，越来越模糊，一个系统将2D和3D融合是必然趋势，你中有我我中有你，也许将来我这个文章标题会让人觉得搞笑，机房监控当然要有3D功能了，何必强调3D，没有3D还算是机房监控吗，好比今天的手机，不能上网还算手机吗？

当然Flex、Silverlight还有很多采用Activex的C++引擎也都可以在Web上跑3D的引擎可以支持，但谁能忽视mobile呢，这些年大家受够了Web开发千奇百怪的大杂烩解决方案，每次到运营商客户运维终端看到古老的IE里面跑着各种插件糅合的脆弱系统，各种OA厂家还自鸣得意的支持IE678，还有不少人拿着facebook从html5迁移到native说事，其一那都是过去式了，其二那不是企业应用，Mark Zuckerberg需要的东西和做企业应用的你我是不一样的东西，下一个时代的企业应用技术必将是清清爽爽的HTML5！

当然3D不是电信网管的专注，以下是我们另一个部门做的太阳能发电、燃气和智能家居行业的3D监控系统应用供参考：

基于HTML5的电信网管3D机房监控应用的更多相关文章

  1. B/S 端基于 HTML5 + WebGL 的 VR 3D 机房数据中心可视化

    前言 在 3D 机房数据中心可视化应用中,随着视频监控联网系统的不断普及和发展, 网络摄像机更多的应用于监控系统中,尤其是高清时代的来临,更加快了网络摄像机的发展和应用. 在监控摄像机数量的不断庞大的 ...

  2. 基于 HTML5 WebGL + VR 的 3D 机房数据中心可视化

    前言 在 3D 机房数据中心可视化应用中,随着视频监控联网系统的不断普及和发展, 网络摄像机更多的应用于监控系统中,尤其是高清时代的来临,更加快了网络摄像机的发展和应用. 在监控摄像机数量的不断庞大的 ...

  3. 基于 HTML5 的 WebGL 自定义 3D 摄像头监控模型

    前言 随着视频监控联网系统的不断普及和发展, 网络摄像机更多的应用于监控系统中,尤其是高清时代的来临,更加快了网络摄像机的发展和应用. 在监控摄像机数量的不断庞大的同时,在监控系统中面临着严峻的现状问 ...

  4. 基于 HTML5 WebGL 的加油站 3D 可视化监控

    前言 随着数字化,工业互联网,物联网的发展,我国加油站正向有人值守,无人操作,远程控制的方向发展,传统的人工巡查方式逐渐转变为以自动化控制为主的在线监控方式,即采用数据采集与监控系统 SCADA.SC ...

  5. 基于HTML5的WebGL电信网管3D机房监控应用

    先上段视频,不是在玩游戏哦,是规规矩矩的电信网管企业应用,嗯,全键盘的漫游3D机房: http://www.hightopo.com/guide/guide/core/3d/examples/exam ...

  6. HTML5+WebGL 的加油站 3D 可视化监控

    前言 随着数字化,工业互联网,物联网的发展,我国加油站正向有人值守,无人操作,远程控制的方向发展,传统的人工巡查方式逐渐转变为以自动化控制为主的在线监控方式,即采用数据采集与监控系统 SCADA.SC ...

  7. 基于HTML5技术的电力3D监控应用（一）

    最近参与了国网计量中心的四线一库自动化检定系统的项目开发,团队封闭开发了大半年终于快到尾声了,整个项目过程实在非常累,我的mentor杨杨老师是这样描述的:累的不想说话了.我估计是我太渴望新知识,整天 ...

  8. 基于 HTML5 WebGL 的地铁站 3D 可视化系统

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

  9. 基于 HTML5 WebGL 的挖掘机 3D 可视化应用

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

随机推荐

  1. 解决chi_sim.traineddata报read_params_file: parameter not found: allow_blob_division

    在使用语音库时候 遇到报错:allow_blob_division,例如使用chi_sim.traineddata;在chi_sim.traineddata(注意版本)文件目录下,使用命令行执行: c ...

  2. set global show_compatibility_56 = on；永久生效MySQL重启

    1. 找到MySQL的配置文件,一般在MySQL的安装目录下,例如我的: C:\Program Files\MySQL\MySQL Server 5.7 ,打开下面的一个配置文件: my-defaul ...

  3. C++ 虚函数在基类与派生类对象间的表现及其分析

    近来看了侯捷的<深入浅出MFC>,读到C++重要性质中的虚函数与多态那部分内容时,顿时有了疑惑.因为书中说了这么一句:使用“基类之指针”指向“派生类之对象”,由该指针只能调用基类所定义的函 ...

  4. Ques前端组件化体系

    Ques是一套组件化系统,解决如何定义.嵌套.扩展.使用组件. 传统开发模式的痛点 无法方便的引用一个组件,需要分别引用其Javascript.Template.CSS文件 我们期望能以MV*的方式去 ...

  5. sqlserver row_number 类似 mysql中 limit 用法

    select * from ( select row_number() over(ORDER BY inspecdate desc,inspectime DESC,itemorder asc ) as ...

  6. c++标准库

    Technical Report 1不是正式的库只是一个草案,作为C++ 2003标准的附加库被大多数编译器厂商所支持,它是个过渡性质的库,其实现将会作为C++11标准的一部分.很多编译器对C++11 ...

  7. 搞不清FastCgi与PHP-fpm之间是个什么样的关系(转载)

    刚开始对这个问题我也挺纠结的,看了<HTTP权威指南>后,感觉清晰了不少. 首先,CGI是干嘛的?CGI是为了保证web server传递过来的数据是标准格式的,方便CGI程序的编写者. ...

  8. Django 源码小剖: Django ORM 查询管理器

    ORM 查询管理器 对于 ORM 定义: 对象关系映射, Object Relational Mapping, ORM, 是一种程序设计技术,用于实现面向对象编程语言里不同类型系统的数据之间的转换.从 ...

  9. Rxlifecycle（二）：源码解析

    1.结构 Rxlifecycle代码很少,也很好理解,来看核心类. 接口ActivityLifecycleProvider RxFragmentActivity.RxAppCompatActivity ...

  10. centos中 mysql 5.7安装

    以免授权模式启动 编辑 /etc/my.cnf,添加以下内容: linux环境中:vi /etc/my.cnf 在[MySQL(和PHP搭配之最佳组合)d]配置段添加如下两行: user=mysql ...