threejs是webgl的一个库,通过它我们可以利用大量已有的api做出很好的3d图形. 第一部分：html页面框架 第二部分：Three.js中的坐标轴 我们要建立三位场景，那么一定是离不开坐标轴的。 创建一个场景非常的简单，就是var scene = new THREE.Scene(); 而创
转载
2017-02-19 00:54:00
526阅读
2评论
部分内容参考自：（1）Three.js百度百科：https://baike.baidu.com/it
原创
2022-11-02 09:17:54
821阅读
一
转载
2013-04-21 22:39:00
357阅读
2评论
<!DOCTYPE html><html><head> <title>Example 01.04 - Materials, light and animation</title> <script type="text/javascript" src="../libs/three.js"></script>
原创
2022-04-24 17:22:29
508阅读
使用图像作为材质。这时候，就需要导入图像作为纹理贴图，并添加到相应的材质中<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html> <head> <script t
原创
2022-04-24 18:12:27
1280阅读
Three.js的核心五步就是： 1.设置three.js渲染器2.设置摄像机camera3.设置场景scene4.设置光源light5.设置物体object1.设置three.js渲染器 三维空间里的物体映射到二维平面的过程被称为三维渲染。 一般来说我们都把进行渲染操作的软件叫做渲染器。 具体来说要进行下面这些处理。 (1) 声明全局render对象； (2) 获取画布的高和宽； (2) 生成
原创
2023-05-31 16:19:45
213阅读
Demo代码地址： https://gitee.com/s0611163/three.js-demo Three.js Three.js下载 从GitHub上下载一个Release版本，https://github.com/mrdoob/three.js，本Demo使用的是r112版本，下载地址：t
原创
2022-04-30 14:08:22
1213阅读
Three.js相机包含四种相机ArrayCamera 包含着一组子摄像机，常用于多人同屏的渲染，更好地提升VR场景的渲染性能StereoCamera 双透视摄像机（立体相机），常用于创建 3D 立体影像，比如 3D 电影之类或 VRCubeCamera 有6个渲染，分别是立方体的6个面，常用于渲染环境、反光等OrthographicCamera 正交相机，在这种投影模式下，无论物体距离相机距离远
转载
2023-11-12 01:21:02
447阅读
three.js学习 6.25更新基础知识引入three.js(webpack搭建的环境）three.js核心组成场景（secne)相机 (camera)创建透视相机创建正交相机总结：渲染器 (render)创建渲染器：物体对象创建物体对象常用几何体三维二维常用材质纹理贴图（texture)灯光基本完整代码 基础知识右手坐标系 three.js中使用的都是右手坐标系，即图示右手大拇指指向x轴正向
转载
2024-04-07 12:49:24
0阅读
<!DOCTYPE html><html><head> <title>Example 01.03 - Materials and light</title> <script type="text/javascript" src="../libs/three.js"></script> <sc
原创
2022-04-24 17:37:13
247阅读
Three.js有一系列导入外部文件的辅助函数，是在three.js之外的，使用前需要额外下载，在https://github.com/mrdoob/three.js/tree/master/examples/js/loaders可以找到。*.obj是最常用的模型格式，导入*.obj文件需要OBJLoader.js；导入带*.mtl材质的*.obj文件需要MTLLoader.js以及OBJMTLL
原创
2022-04-24 18:11:51
537阅读
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html> <head> <script type="text/javascript" src="libs/three
原创
2022-04-24 18:12:54
324阅读
什么是WebGL。WebGL是在浏览器中实现三维效果的一套规范。使用WebGL原生的API来写3D程序是一件非常痛苦的事情，幸好，有很多同行花业余时间写了一些WebGL开源框架，其中three.js就是非常优秀的一个。 什么是threejs，很简单，你将它理解成three + js就可以了。thre
原创
2021-07-14 16:47:45
1202阅读
①基本光源THREE.AmbientLight属性为color使用此光源时，此光源的颜色将会应用到全局，即场景中的所有物体都有这种光源的颜色，通常不能将它作为唯一光源，它不会生成阴影②点光源THREE.PointLight属性有color，distance，intensity，position，visible单点发光，用于照射所有方向，不会生成阴影。color定义颜色，dis...
原创
2021-09-03 13:42:02
526阅读
在Threejs中，光源用Light表示，它是所有光源的基类。它的构造函数是：THREE.Light ( hex )它有一个参数hex，接受一个16进制的颜色值。例如要定义一种红色的光源，我们可以这样来定义：Var redLight = new THREE.Light(0xFF0000);Three.js内置了多种光源可以直接调用：AmbientLight（环境光）AreaLight（区域光）Di
原创
2022-04-24 17:22:04
684阅读
1.下载three.js库。https://github.com/mrdoob/three.js/第一步：新建一个项目文件夹“Threejs”第二步：在Threejs文件夹内新建一个html文件（index.html）。该文件是通过浏览器进入游戏的入口。第三步：在Threejs文件夹内新建一个libs文件夹，用来存放three.js库和需要用到的其他库。第四步：在Threejs文件夹内新建
原创
2022-04-24 17:50:36
690阅读
开场白webGL可以让我们在canvas上实现3D效果。而three.js是一款webGL框架，由于其易用性被广泛应用。如果你要学习webGL，抛弃那些复杂的原生接口从这款框架入手是一个不错的选择。博主目前也在学习three.js，发现相关资料非常稀少，甚至官方的api文档也非常粗糙，很多效果需要自己慢慢敲代码摸索。所以我写这个教程的目的一是自己总结，二是与大家分享。本篇是系列教程的第一篇：入门篇。在这篇文章中，我将以一个简单的demo为例，阐述three.js的基本配置方法。学完这篇文章，你将学会如何在浏览器中绘制一个立体图形！准备工作在写代码之前，你首先要去下最新的three.js框架包，
转载
2013-05-03 19:38:00
328阅读
2评论
BufferGeometry是Three.js最基本的几何体。所有的几何体都继承于BufferGeometry。BufferGeometry的使用。// Scene
const scene = new THREE.Scene()
const geometry = new THREE.BufferGeometry();
// create a simple square shape. We du
原创
2023-11-12 12:18:45
381阅读
## Python与Three.js：构建交互式3D可视化
### 简介
在数据分析和可视化领域，3D图形是一种有力的工具，它可以为数据提供更丰富的视觉表达和更深入的理解。Python是一种强大的编程语言，提供了许多用于数据分析和可视化的库，而Three.js是一个用于在Web浏览器中创建3D图形的JavaScript库。
本文将介绍如何使用Python和Three.js来构建一个交互式的3
原创
2023-08-10 06:58:53
1170阅读
three.js实践-在codepen.io调试three.js
将本地的three.js调试例子上传到codepen.io上看能不能用，这样更方便调试看效果。
codepen.io初体验，用来调试还是挺方便,就是没找到怎么上传资料图片等,内容无法丰富。
只是这个新版本three.js引用有点无从找，这里用了别人写的例子的里的，找到这个three.js 156版本可能，照猫画虎试一下，能行。
