基于 HTML5 WebGL 的 3D 工控裙房系统

工业物联网在中国的发展如火如荼,网络基础设施建设,以及工业升级的迫切需要都为工业物联网发展提供了很大的机遇。中国工业物联网企业目前呈现两种发展形式并存状况:一方面是大型通讯、IT企业的布局;一方面是传统工业软件和工业网络企业自发地延伸,由产品提供商发展为方案供应商。 ... »

使用着色器在WebGL3D场景中呈现行星表面地形

实验目的:按照一定规律生成类地行星地表地形区块,并用合理的方式将地形块显示出来 涉及知识:Babylon.js引擎应用、着色器编程、正态分布、数据处理、canvas像素操作 github地址:https://github.com/ljzc002/ljzc002.github.io/tree/mast ... »

基于 HTML5 WebGL 的 3D 棉花加工监控系统

远程监控系统主要是通过分布于棉花加工生产线各种设备的传感器、开关信号、视频监控设备、 PLC 控制器等装置,通过智能联网设备集成到互联网和局域网上面,实现对生产、运营情况的随时掌握,建立网络范围内的监控数据和网上知识资源库,根据现场采集的设备运行数据进行远程诊断和在线维修。 ... »

WebGL展示3D房屋内景

  原文地址: "WebGL展示3D房屋内景"   由于生活和工作上的原因,从年前开始一直到处奔波,没有太多的时间去关注和学习WebGL图形学相关的技术, 不过陆陆续续都有学习使用blender进行3D建模, 而这篇文章涉及到的房屋内景3D建模就是我这段时间以 ... »

Javascript如何实现GPU加速?

一、什么是Javascript实现GPU加速? CPU与GPU设计目标不同,导致它们之间内部结构差异很大。CPU需要应对通用场景,内部结构非常复杂。而GPU往往面向数据类型统一,且相互无依赖的计算。所以,我们在Web上实现3D场景时,通常使用WebGL利用GPU运算(大量顶点)。但是,如果只是通用的 ... »

基于 HTML5 的 WebGL 3D 版俄罗斯方块

2D 的俄罗斯方块已经被人玩烂了,突发奇想就做了个 3D 的游戏机,用来玩俄罗斯方块。。。实现的基本想法是先在 2D 上实现俄罗斯方块小游戏,然后使用 3D 建模功能创建一个 3D 街机模型,最后将 2D 小游戏贴到 3D 模型上。 ... »

基于 HTML5 WebGL 的低碳工业园区监控系统

低碳工业园区的建设与推广是我国推进工业低碳转型的重要举措,低碳工业园区能源与碳排放管控平台是低碳工业园区建设的关键环节。如何对园区内的企业的能源量进行采集、计量、碳排放核算,如何对能源消耗和碳排放进行实时动态监测等问题,涉及多个技术领域,专业性强。其数据不仅要求准确,更要求真实可靠(即可核查、可溯源... ... »

基于babylon3D模型研究3D骨骼动画(1)

3D骨骼动画是实现较为复杂3D场景的重要技术,Babylon.js引擎内置了对骨骼动画的支持,但Babylon.js使用的骨骼动画的模型多是从3DsMax、Blender等3D建模工具转换而来,骨骼动画的具体生成方式被透明化。本文从babylon格式的3D模型文件入手,对骨骼动画数据的生成方式进行具 ... »

基于 HTML5 的 WebGL 3D 智能楼宇监控系统

智能监控的领域已经涉及到了方方面面,之前我写过一篇 2D 的智能地铁监控系统广受好评,突然觉得,既然 2D 的这么受欢迎,那么 3D 的需求量肯定也是非常大的,于是有了这个例子以及这篇文章。智能监控系统在 3D 中应用比较广泛的除了 3D 机房以外,我觉得就是楼宇监控,解放前端工程师绘制 3D 模型... ... »

如何用webgl(three.js)搭建一个3D库房-第二课

闲话少叙,我们接着第一课继续讲(http://www.cnblogs.com/yeyunfei/p/7899613.html),很久没有做技术分享了。很多人问第二课有没有,我也是抽空写一下第二课。 第一课程提到了在库房的基础上添加上下架 消防 温湿度等等控制 刚好 最近有接到一个客户的需求 是和库房 ... »

【webGL入门2】点线面的绘制

用js绘制webGL的点: THREE.Vector3 = function ( x, y, z ) { //用THREE声明的变量都是全局变量。this.x = x || 0;this.y = y || 0;this.z = z || 0;}; 注意:“||”(或)运算符,就是当x=null或者u ... »

WebGL 3D 工业隧道监控实战

工业中的隧道我们可能接触的不多,但是在我看来,其中的实时监控是非常有必要的,事故的发生,事故发生地的事故内容,隧道中的排气,逃生通道等等,都是需要有外部人员监控操作的,会比真正事故发生的时候,现场操作这些会更好、更安全,这个 Demo 由此而生。 ... »

WebGL 3D 电信机架实战之数据绑定

在前端中,视图层和数据层需要进行单向或者双向数据绑定,大家都已经不陌生了,有时候 2D 做的比较顺了之后,就会想要挑战一下 3D,不然总觉得痒痒的。这个 3D 机架的 Demo 我觉得非常有代表性,首先,3D 机架用途非常广,尤其是在电信行业,就算不是机架,在比如工业方面 3D 模型以及数据绑定的应... ... »

基于 HTML5 WebGL 的 3D 机房

WebGL 渲染的 3D 机房?漂亮的 3D 机房配上流畅的切换,最喜欢镜头缓缓移动的感觉了!而且移动一定要自然!这个 Demo 就是为了纪念一下第一次搭配 eye 和 center 做出的“镜头感”! ... »

快速开发 HTML5 WebGL 的 3D 斜面拖拽生成模型

如何在一个斜面上创建 3D 模型?如何通过拖拽创建 3D 模型?这些我们在实际项目中用到的概率也着实不低。我们知道,空间中存在无数个面,一个点和一条法线就能创建一个面,如何利用好这两个部分? ... »

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

服务端与客户端的通信可以说是经典的例子了,但是如何快速搭建 3D 的 SCADA 系统,还要加上鹰眼的部分,如果是纯手工 HTML5 来做的话,能完成,但是时间也消耗了许多,而这个例子的鹰眼部分只要 1 行代码。。。整个例子只有两百多行代码! ... »

基于 HTML5 的 3D 工控隧道案例

HTML5 WebGL 技术能够在浏览器里更流畅地展示 3D 场景和模型,还能创建复杂的导航和数据视觉化,所以在 3D 项目上被广泛采用,HTML5 采用插件型和原生型,很多插件的添加还是比较让人头疼的,所以我用原生的写了这个项目,也不复杂,大家可以参考一下~ ... »

利用 HTML5 WebGL 构建的 3D 拓扑图

如果我们可以不用学习 unity3d 或者其他游戏开发工具就能实现 3D 效果,而且能够精准的靠代码来控制移动或者方向就好了。。。今天的例子希望能帮到一些开发 3D WebGL 的前端人员,更快速地开发项目! ... »

利用 HTML5 WebGL 构建的 3D 拓扑图

如果我们可以不用学习 unity3d 或者其他游戏开发工具就能实现 3D 效果,而且能够精准的靠代码来控制移动或者方向就好了。。。今天的例子希望能帮到一些开发 3D WebGL 的前端人员,更快速地开发项目! ... »