Three.js

WebGL（Web Graphics Library）

一种3D绘图协议，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript绑定，WebGL可以为HTML5 Canvas提供硬件3D加速渲染，这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。

大家好,我是yangyang.最近工作中在接触基于threejs实现的vr全景阅读器photo-sphere-viewer插件来做vr装修编辑器,使用过程中遇到关于视角调整的问题,并开始对欧拉角的概念有了一些认识.

关于欧拉角Picth、Yaw、Rol

我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第1篇文章，点击查看活动详情

本文简介

点赞 + 关注 + 收藏 = 学会了

渲染阴影效果需要消耗一定的资源，所以 Three.js 默认是关闭阴影效果的。

想要在 Three.js 中实现阴影效果，只需记住接下来要讲的几个点即可。

本文要实现的效果

纹理贴图（Textures）字面意思就是給几何体对象贴上不同的纹理图！好比于我们每天选择穿不同的衣服，我们穿不同的衣服带来的感官会有很大变化！同理几何体不同贴图的视觉效果也会有千差万别。纹理贴图是 Three.js一个很重要的内容，掌握了纹理贴图可以让3d效果产生质的飞跃。

在Three.js中实现阴影需要几个步骤，包括设置渲染器、光源以及物体的材质等。以下是一个基本的实现阴影的步骤：

1、设置渲染器以支持阴影：

const renderer = new THREE.WebGLRenderer();  
renderer.setSize(window.innerWidth, window.innerHeight);  
renderer.shadowMap.enabled = true;  // 启用阴影映射  
document.body.appendChild(renderer.domElement);

封面图：掘友留白大哥的自拍（有图有真相）

本文简介

点赞 + 关注 + 收藏 = 学会了

不管是做游戏还是做普通网页，在这个时代基本都离不开动画。

说到动画，第一个联想到的概念就是“帧”。这是用来衡量和描述动画是否流畅的一个单位。

导读：最近我购置了一台新的电脑，硬盘空间只有1T。我很担心这个电脑还能用多久。性能限制或者空间的限制，都使得在未来3-5年内，这个电脑会被淘汰。

但是，基于云APP的使用，老的电脑是足够了，而且，我们也不会被window或者linux的选择而费尽心思。

性能，在本地的限制将不再成为瓶颈。

这篇文章详细介绍了三次曲线、贝塞尔曲线和 B 样条曲线和曲面背后的数学原理，并提供了使用 Three.js 库实现的代码。

1、简介

Three.js是开源的宠儿，这是有充分理由的。它彻底改变了我们在网络上处理 3D 的方式，并且自r12013 年发布以来一直在不断发展。使用该库开发 3D 世界确实非常简单，但当您突破 2D 限制时，它仍然感觉像是一个神奇的补充网络。我们先建立一个基地。

# threejs 多屏互动效果，居然还能这么玩

**引言**

在Web前端技术的广阔天地中，Three.js无疑是最具魔力的一款3D图形库。当你尝试将Three.js与多屏互动相结合，将会碰撞出怎样的火花呢？本文将深入探讨如何通过Three.js实现多屏联动，解锁前所未有的Web体验，带你领略视觉艺术与科技交融的魅力。

**一、多屏互动基础概念**