序: 上节课已经详细描述了普通机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10473021.html) 紧接着上节课的内容 我们这节可来详细讲解机房微模块的三维实现 首先我们先看一下整体的效果图: 这是单个微模块的模拟最后的系统效果 下面我们进入正文,详细讲解创建过程(机房的以及其它动力环境的创建 前面的课程已经讲诉 这里不在累赘描述) 一.创建组件 正所谓造车得现有轮子,那么搭建整个机房得先创建一个个小的组件,最后组合成大的模块.我们的步骤是…
上节课已经详细描述了微模块机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10484241.html) 紧接着上节课的内容 我们这节可来详细讲解科技版机房的三维实现 随着数据大屏的普及,实用与科技感这样的双向标应运而生. 这节课我们就主要展示一下科技感的数据中心,结合上节课的微模块,再加上一个科技感强一点的房间. 首先我们先看一下整体的效果图: 一.功能描述: 1.1.告警展示: 1.1.1.当服务器有告警时,机柜也会对应的闪动. 1.1.2.内部…
序: 目前市面上的数据中心主要分两大类,一类属于普通数据中心,机柜按照XY轴 有序排放,一类属于微模块集合的数据中心,多个机柜组合而成的微模块.  本节课主要详细讲解普通数据中心的可视化展示,浏览器直接查看机房实时3D数据.  功能简述:普通3D机房搭建,机柜.服务器.端口实时监控 数据联动展示,机柜动态添加.服务器上下架,动力环境数据可视化展示(温湿度云图,防盗门禁,配店,管线控制).告警展示: 技术难点: 一.如何有效快速根据实际场景搭建机房模型 解决方案:封装各代码模型,复用代码模型,争取…
WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学中的纹理既包括通常意义上物体表面的纹理即使物体表面呈现凹凸不平的沟纹,同时也包括在物体的光滑表面上的彩色图案,所谓的纹理映射就是在物体的表面上绘制彩色的图案. 在three.js中使用纹理可以实现很多不同的效果,但是最基本的就是为网格体的每个像素指定颜色.等同于将一张纹理图片应用在一个几何体的材质上…
WebGL学习----Three.js学习笔记(5) 点击查看demo演示 Demo地址:https://nsytsqdtn.github.io/demo/360/360 简单网格材质 MeshNormalMaterial MeshNormalMaterial是一种不受渲染时使用的颜色影响的材质,它只与自己每一个面从内到外的法向量有关.法向量在webgl中用处十分广泛,光的反射,以及三维图形的纹理映射都与这个有关. 从图中可以看到,网格的每一面渲染的颜色都是不一样的,如果我们想要在物体表面添加法…
(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div -> body -> html -> document Mozilla 1.0: div -> body -> html -> document -> window (2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开…
. 参考: http://www.jb51.net/article/42492.htm 图: 假设一个元素div,它有一个下级元素p.<div> <p>元素</p></div>这两个元素都绑定了click事件,如果用户点击了p,它在div和p上都触发了click事件,那这两个事件处理程序哪个先执行呢?事件顺序是什么?…
序:前段时间公司一次研讨会上,一市场部同事展现了同行业其他公司的3D机房,我司领导觉得这个可以研究研究,为了节约成本,我们在网上大量检索,最后找到一位前辈的博文[TWaver的技术博客],在那篇博文的评论区终于找到了那位前辈的源码,可惜下载后发现是压缩过的.min.js文件.经过各种研究发现,那是人家公司自己卖钱的库,不能完全共享,所以我司决定,派本人研究一下web3D的技术,于是乎便有了下面的技术分享. 一.本着开源的思想,使用three.js框架,封装常用的模型库.先学着那位前辈的样子,使用…
写在前面的话: 说点啥好呢?就讲讲前两天的小故事吧,让我确实好好反省了一下. 前两天跟朋友一次技术对话,对方问了一下Geometry与BufferGeometry的具体不同,我一下子脑袋短路,没点到重点定义,被朋友嘲笑一番,亏还搞了three.js 这么久,这么简单的基础知识尽然不能对答如流,原来都是假把式.着实尴尬至极,尴尬至极.... 朋友间的调侃,本是玩笑,但认真思考,不无道理.正所谓温故而知新,也是我们程序员的必须课程,不仅仅是学习利用新技术,对自己常用的老技术也要时长翻看一下,加强记忆…
前言: 今年是建国70周年,爱国热情异常的高涨,为自己身在如此安全.蓬勃发展的国家深感自豪. 我们公司楼下为庆祝国庆,拉了这样的标语,每个人做好一件事,就组成了我们强大的祖国. 看到这句话,深有感触,是的,强大的背后离不开我们每个人的奋力拼搏,作为基础研发的我们,我们也认认真真的做好每一次研发,不管成功失败,都是在前进的路上. 序: 今天要讲解的课程是<智慧园区与灯杆三维展示>课程. 首先我们描述一下智慧园区与灯杆的功能: 智慧园区:我们在上节课<使用webgl(three.js)搭建一…