在Three.js的赋能下，WEB网页效果逐渐丰富起来，今天我们就来运用之前学习的Three.js基础知识，实现一个旋转的几何体-球体。
随着时代的发展和科技的进步，人们的生活水平和消费需求不断提高。商场作为购物、休闲、娱乐的综合性场所，受到了越来越多消费者的青睐。然而，随着商场规模的不断扩大和楼层的增多，很多人在商场内总是感到迷茫，很难快速找到目标店家。为了解决这一问题，利用 WebGL 和 Three.js 技术实现多楼层商场地图成为了一种新的解决方案。
一般我们拍照都是拍一个方向，而全景图是拍上下左右前后 6 个方向，360 度，这样能够立体的记录所在的场景。
在meshGroup.add(earthMesh)后面调用createMapPoints方法
我们都知道现今社会复合型人才是企业刚需，只会一项本领难以在企业中立足，即便是前端工程师，如果你只会敲代码改网页也是不行了，要多方面拓展自己的才能。比如研究可视化方向的3D开发。这就需要借助可视化pass平台平台来完成。
前言：本文将围绕：了解什么是全景 --> 怎么构成全景 --> 全景交互原理来进行讲解，手把手教你从零基础实现一个酷炫的Web全景，并讲解其中的原理。小白也能学习，建议收藏学习,有任何疑问，请在评论区讨论，笔者经常查看并回复。
Web 全景在以前带宽有限的条件下常常用来作为街景和 360° 全景图片的查看。它可以给用户一种 self-immersive 的体验，通过简单的操作，自由的查看周围的物体。随着一些运营商推出大王卡等
纯前端实现的量子纠缠效果视频在网络上迅速传播开来。视频中，作者在两个窗口中打开了相同的网页，然后在两个窗口中同时移动鼠标。
经过上一小节，我们学会了如何使用各种类型的灯光。既然有了光，那还得有阴影，这样看起来才会更加真实。
随着人们对用户体验越来越重视，Web开发已经不满足于2D效果的实现，而把目标放到了更加炫酷的3D效果上。Three.js是用于实现web端3D效果的JS库，它的出现让3D应用开发更简单，本文将通过Three.js的介绍及示例带我们走进3D的奇妙世界。
笔者认为Three.js是一个伟大的框架，为什么这样说，因为它可以让我们轻易创造三维世界，甚至好像笔者写这遍教程，可以创造一个太阳系，在这个三维世界里你就是创世主。哈哈！好像说得有点夸！！
大家好，我是秋风，由于最近业余时间一直在维护我的独立产品 木及简历[1]，近期上线了一个开发了1个月的插件，稍微腾出一些时间，立马来更新了，之前实在是腾不出时间来更新公众号，首先说声抱歉。
在上一篇案例中实现了几何体-球体旋转效果，今天继续丰富这个案例效果，在球体的周围添加光圈及旋转模块（图片+文字组成），均匀的分布在球体周围，围绕着球体逆时针旋转，最终效果如图：
个人博客是程序员的第二张简历。如果你有酷炫的个人网页，面试官对你的好感度会蹭蹭蹭往上涨。
Three.js 是一款运行在浏览器中的 3D 引擎，你可以用它创建各种三维场景，包括了摄影机、光影、材质等各种对象。
简单来说，babylon.js 是一个能跑在浏览器上的(3D)游戏渲染引擎，而且官方提供了一个友好在线交互学习平台Playground，其开源项目在github上star数截止2023.05.14高达20.6K。下面是官方文档的学习笔记 ：
一个鼓舞人心的演示，用three.js探索3D空间中的粒子动画。 这种类型的动画可能非常适合页面加载器。
本篇文章介绍纹理（Texture Map，也译作纹理映射）的使用，将描述如何使用Three.js给3D对象添加贴图， 贴图是通过将图像应用到对象的一个或多个面，来为3D对象添加细节的一种方法。
本案例为一个 threejs 的特效网页，大小球体进行包裹，外球体为透明材质，但是进行了线框渲染，使其能够通过外球踢查看其内球体。 注：案例参考源于互联网，在此做代码解释，侵删 本案例除 ThreeJS 外不适用任何第三方框架，放心食用 懒的同学可以直接下载代码，打赏作者一根精神食粮：https://download.csdn.net/download/A757291228/87871503
Three.js 是一个功能强大的 JavaScript 库，用于在 Web 浏览器中创建和显示动画 3D 图形。它的丰富 API 和模块化设计使得开发者可以轻松构建复杂的 3D 场景和动画效果。本文将详细介绍 Three.js 中的一些重要组件和模块，包括场景、相机、几何体、材质、光源、渲染器和控制器等。
为了控制谷物储藏温度，需要创造一个不利于虫霉生长低温环境的储粮技术环境，然而出于成本考虑以及进出粮的需要，粮堆内的温度传感器设置数量有限，因此在储粮当中测得的温度值只是传感器附近的温度，其他部分则需要利用相应的方法进行数值模拟。
今天分享一篇用three.js 做的登录网站，里面还用到了粒子特效，一个字就是酷炫😎 前言： 该篇文章用到的主要技术：vue3、three.js 我们先看看成品效果： 登录gif 图 座机小图预览： login2.gif 废话不多说，直接进入正题 Three.js的基础知识 想象一下，在一个虚拟的3D世界中都需要什么？「首先，要有一个立体的空间，其次是有光源，最重要的是要有一双眼睛」。下面我们就看看在three.js中如何创建一个3D世界吧！ 创建一个场景 设置光源 创建相机，设置相机位置和相
今天郭先生说一说如何在three.js着色器中添加纹理，先看看今天要完成的效果，在线案例请点击着色器纹理。
之前的章节中我们使用了平地、方块、球体等几何体（Geometry），今天我们探讨更多的几何体。 先说一个事实，在WebGL中只能绘制3种东西，分别是点、线和三角形。什么？我们之前做的方块和球体，明明就不是三角形呢？其实他们确实是由三角形组成的。多个小的三角形就是可以组成包括球体以内的几乎任何几何体。我们先从简单的例子开始今天的课程吧。
疫情期间，打破社交距离限制的交互模式被推向前台，为不少行业的传统交易提供了想象的空间。
事情是这样的，前几天我接到一个外包工头的新需求，某品牌要搭建一个在线VR展厅，用户可以在手机上通过陀螺仪或者拖动来360度全景参观展厅，这个VR展厅里会有一些信息点，点击之后可以呈现更多信息（视频，图文等）...
经过前面几个章节的介绍，我们对Threejs已经有了一个相对深入的了解，下面我们通过Threejs来做一个旋转的地球效果。 1.首先在电脑上创建一个earth文件夹，在earth文件夹中创建images文件夹用于存放图片文件；创建一个js文件夹用于存放JavaScript代码；创建一个css文件用于存放css样式表文件； 2.拷贝资源，将Threejs源码中的three.module.js拷贝到js文件夹，将地图的贴图文件拷贝到images文件夹 3.用vscode打开earth文件夹，在根目录下新建index.html文件，在index.html中引入three.module.js，在index.html中创建一个id为webgl的div
本文是three.js系列博文的一篇，第一篇文章是【three.js基础知识】，如果你还没有阅读过，可以从这一篇开始，页面顶部可以切换为中文或英文。
虚拟现实（VR）是一种依赖计算机生成环境的体验，其应用范围广泛：美国利用虚拟现实进行冬季奥运会的运动训练；外科医生正在试验用虚拟进行医学培训；把虚拟现实用于游戏是最常见的一种应用。
在最初的六天，我创造了天与地 webGL是基于OpenGL的Web3D图形规范，是一套JavaScript的API。简单来说，可以把它看成是3D版的canvas。恩，你会这样引入canvas对吧：
webGL是基于OpenGL的Web3D图形规范，是一套JavaScript的API。简单来说，可以把它看成是3D版的canvas。恩，你会这样引入canvas对吧：
作者|訾竣喆 转自|雷锋网 如今，当我们看板球或是网球的比赛的时候很容易发现，机器视觉技术（machine-vision techniques）早已革命性地开始辅助裁判进行现场的即时分析和判罚。例如，
前面的代码中我们一直使用立体缓冲几何体BoxGeometry来构造物体，这样构造出来的是一个长方体或正方体，Threejs提供了很多几何体的API，如圆形缓冲几何体、圆锥缓冲几何体、圆柱缓冲几何体等，下面一一进行介绍 1.立方缓冲几何体（BoxGeometry），立方缓冲几何体我们前面已经使用过了，它是四边形的原始几何类，它通常使用构造函数所提供的“width”、“height”、“depth”参数来创建立方体或者不规则四边形。 BoxGeometry可以接收6个参数，具体如下 BoxGeometry(width : Float, height : Float, depth : Float, widthSegments : Integer, heightSegments : Integer, depthSegments : Integer) width — X轴上面的宽度，默认值为1。 height — Y轴上面的高度，默认值为1。 depth — Z轴上面的深度，默认值为1。 widthSegments — （可选）宽度的分段数，默认值是1。 heightSegments — （可选）高度的分段数，默认值是1。 depthSegments — （可选）深度的分段数，默认值是1。 添加立方缓冲几何体到场景中，前面也使用过，使用下面的代码可以将立方缓冲几何体添加到场景中
在去年cosbeta曾经发布了一个网页计算工具，这个作用就是根据地球上两点之间的经纬度计算两点之间的直线距离。经纬度到距离的计算在通信工程中应用比较广泛，所以cosbeta通过搜索找到了一个js的计算脚本（其实是google map的计算脚本，应该算是比较准确了），做成了这个经纬度算距离的工具。
这是渲染系列的第19篇教程。上一章节涵盖了 realtime GI, probe volumes, 和LOD groups，这一节我们来试一下另外一种缩减DrawCall的方法，合批。
现代煤矿开采过程中，安全一直是最大的挑战之一。地质空间中存在诸多如瓦斯积聚、地质构造异常、水文条件不利等隐蔽致灾因素，一旦被触发，可能引发灾难性的后果。因此在安全生产过程中有效的管理和规避各隐蔽致灾因素，有着重要的意义。
假想将静止的平均海水面，延伸到大陆内部，形成一个连续不断的，与地球比较接近的形状，其表面称之为大地水准面，由它包围的球体叫“大地体”。
上次在文章ThreeJS中三维世界坐标转换成二维屏幕坐标介绍了三维二维坐标的转换方法，今天结合一个用例具体说下用法。
地球表面并不是一个标准的正球体，根据2020年的测量成果，珠穆朗玛峰高程为8848.86m，而地球上最深的海沟——马里亚纳海沟深度为11034 m。两者相差了将近 20 km！由于地球的自然表面凹凸不平，形态复杂，显然不能作为测量的基准面。所以人们开始寻求一种与地球自然表面接近的规则曲面来代替不规则的地球表面。地球表面积中海洋面积约占71%，陆地面积仅占29%。于是利用水准面表示地球的物理表面，简单说就是假设有一个静止的海水面（一个无波浪、无潮汐、无水流、无大气压变化，处于流体平衡状态的静止海平面），向陆地延伸形成的一个封闭曲面来表示地球的物理表面。
该博客实时更新于我的Github。 在机器人局部路径规划中，需要实时躲避运动或者静态的障碍物，这个过程涉及到碰撞检测这个问题，本文主要讨论这个问题。 碰撞检测问题也是游戏开发中经常遇到的问题，一个游戏场景中可能存在很多物体，它们之间大多属于较远位置或者相对无关的状态，那么一个物体的碰撞运算没必要遍历这些物体，我们可以使用一个包围一个或多个物体的多边形来讨论碰撞问题，这样子可以节省重要的计算量和时间。 在真实的物理系统中，一般需要在运算速度和精确性上做取舍。尽管非常精确的碰撞检测算法可以
最近接手一个GIS项目，需要用到 PostGIS，GeoServer，OpenLayers 等工具组件，遇到一堆地理信息相关的术语名词，在这里做一个总结。
这是有关控制角色移动的教程系列的第七部分。它解决了在运动中的地形上站立和导航的问题。
这是有关控制角色移动的教程系列的第11部分，也是最后一部分。它把我们毫无特色的球变成了滚动的球。
DFA47D5C-AE21-4A3A-8E53-858CBA60B647.png
该博客实时更新于我的Github。
今天给大家带来的就是一款叫做《见缝插针》的游戏。有空你就往里插，直到你无处可插！看你能过多少关！
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
