在线客服
扫描二维码
下载博学谷APP扫描二维码
关注博学谷微信公众号
Three.js基础知识分享 帮你入门学习JavaScript 3D 库,学习Three.js需要先了解一下 OpenGL 和 WebGL。OpenGL 是一个跨平台的3D/2D的绘图标准(规范),WebGL(Web Graphics Library)是一种3D绘图协议。WebGL允许把JavaScript和OpenGL 结合在一起运用,但使用WebGL原生的API来写3D程序非常的复杂,同时需要相对较多的数学知识对于前端开发者来说学习成本非常高。
WebGL
WebGL是一种Javascript的3D图形接口,把JavaScript和OpenGL ES 2.0结合在一起。
OpenGL
OpenGL是开放式图形标准,跨编程语言、跨平台,Javascript、Java 、C、C++ 、 python 等都能支持OpenGL ,OpenGL的Javascript实现就是WebGL。OpenGL ES 2.0是OpenGL的子集,针对手机、游戏主机等嵌入式设备而设计。
Canvas
Canvas是HTML5的画布元素,在使用Canvas时,需要用到Canvas的上下文,可以用2D上下文绘制二维的图像,也可以使用3D上下文绘制三维的图像,其中3D上下文就是指WebGL。
Three.js是什么?
官网:Javascript 3D library(JavaScript 3D 库)。
Three.js是基于webGL的封装的一个易于使用且轻量级的3D库,Three.js对WebGL提供的接口进行了非常好的封装,简化了很多细节,大大降低了学习成本,极大地提高了性能,功能也非常强大。
用户不需要详细地学习 WebGL,就能轻松创作出三维图形,是前端开发者研发3D绘图的主要工具。
微信小游戏跳一跳也是在基于Three.js研发的,Threejs现在是独领风骚。
简言之:Three.js就是能够实现3D效果的JS库
OpenGL、WebGL、Canvas、Three.js四者关系
OpenGL:3D绘图标准
WebGL:OpenGL + JavaScript
Canvas:WebGL + Canvas 2D
Three.js:一个基于WebGL封装的库
类似于:
ECMAscript:脚本语言规范
JavaScript:脚本语言
jQuery: 一个基于JavaScript封装的库
简单一句话概括:WebGL和Three.js的关系,相当于JavaScript和jQuery的关系。
Three.js应用场景有哪些?
Web 3D游戏、3D物体模型展示、数据可视化、Web VR、其它特殊效果展示。
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
CSS流式布局 知识讲解
CSS的工作方式是浏览器逐行下载样式表,应用其可识别的属性,忽略其不支持的属性。本文将介绍CSS流式布局,分别从html结构、固定布局样式、将固定布局改为流式布局三个方面来阐述,感兴趣的小伙伴可以继续看下去。
5522
2019-08-02 14:12:38
丁香医生的实时疫情前端界面分析
开年就来势汹汹的新型冠状病毒,从疫情扩散到初见好转,无时无刻不在牵动着大众的心,隔离在家的每个人每天共同关注的就是疫情发展情况。这个时候,丁香医生的出现无疑帮助了大众对于疫情的实时追踪。那么丁香医生28亿多浏览量的实时疫情界面是如何实现的呢?下面我们从前端的角度,分析一下丁香医生实时疫情界面的成功之处。
7711
2020-04-02 15:30:07
什么是HTTP协议?工作原理是怎样的?
什么是HTTP协议?工作原理是怎样的?HTTP协议全程是超文本传输协议,它的工作原理简单来讲,就是客户端连接到web服务器,然后发送HTTP请求,服务器接受并返回HTTP响应。下面让我们一起来详细了解一下HTTP协议。
5117
2020-07-30 19:33:30
网站域名后缀都是什么含义?
2019年我国网站数量已经达到518万个,每一个网站都有一个唯一的网站域名。例如百度(baidu.com)、博学谷(boxuegu.com)、淘宝(taobao.com)等等。细心的同学可能会注意到大部分域名的后缀都是.com。这些网站域名后缀都是什么含义呢?应该如何选择一个适合自己的域名呢?
5510
2020-08-03 14:05:09
前端要学多久才能去工作?具备什么技能?
零基础的初学者系统学习前端知识,学完差不多需要6个月左右的才能找工作。有一定基础的同学能够更快掌握前端技术。学习前端找工作要多久因人而异,更应该注意的是学习质量才对。只有学到了有用的技能才能不愁找不到工作。
4615
2021-01-29 16:22:03