使用 Three.js 时在 Windows 上缺少线宽的解决方法
我正在尝试使用 Three.js 绘制旋转 3D 坐标系.我希望轴具有一定的厚度，到目前为止我已经使用 LineBasicMaterial 的线宽参数实现了这一点. 以下代码对我有用，因为我不在 Windows 上: var scene = new THREE.Scene();var camera = new THREE.PerspectiveCamera( 75, window.inn
..
webgl相关内容
Three.js 检测 webgl 支持并回退到常规画布
任何使用过 Three.js 的人都可以告诉我是否可以检测 webgl 支持，如果不存在，则退回到标准的 Canvas 渲染? 解决方案 是的，这是可能的.您可以使用 CanvasRenderer 而不是 WebGLRenderer. 关于 WebGL 检测: 1) 阅读这篇 WebGL 维基文章:http://www.khronos.org/webgl/wiki/常见问题解答
..
使用 2D 纹理解决方法的 WebGL/three.js 中的 3D 纹理?
我想为我在 WebGL 中渲染的对象使用一些 3D 纹理.我目前在片段着色器中使用以下方法，如 WebGL 和 OpenGL 差异: //tex 是一个纹理，立方体的每个切片都水平放置在纹理上.//texCoord 是一个 3d 纹理坐标//size 是立方体的大小，以像素为单位.vec4 sampleAs3DTexture(sampler2D tex，vec3 texCoord，浮动大小){浮
..
THREE.js:计算对象上某个点的世界空间位置
我有一个 3D 对象.“附加"是一个点.当物体移动或旋转时，点也随之移动和旋转. 给定对象的位置和旋转，如何计算该点在世界空间中的位置?(如果可能，使用 THREE.js 的 API) 谢谢 解决方案 对于对象局部坐标系中的点， object.localToWorld( point ); 将返回点的世界坐标，假设对点应用与对对象应用相同的变换. three.js r.
..
Three.js:如何将场景的 2D 快照制作为 JPG 图像?
我有一个 Three.js 场景，如下所示: var scene = new THREE.Scene();var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);var renderer = new THREE.WebGLRenderer();renderer.s
..
Threejs:为几何中的每个顶点分配不同的颜色
我想通过 Three.js 中的 IdMapping 进行采摘 由于性能问题，我只有一个巨大的几何图形，计算如下: for (var i = 0; i 如何为几何中的每个顶点指定不同的颜色? 解决方案 它必须是 geometry.vertexColors 而不是 geometry.colors(按顶点推送颜色). 和材料: material = new THREE.Me
..
抗锯齿在 Three.js 中不起作用
我是 Three.js 的新手，最近开始大量使用它.我真的很喜欢它，我创造了一些令人难以置信的东西.但是，我不确定为什么但是将抗锯齿设置为 true 时我看不出有什么区别. renderer = new THREE.WebGLRenderer({ antialiasing: true }); 我已经搜索了可能的解决方案，但我似乎无法找到或理解为什么这不起作用.为了使抗锯齿工作，我是否缺少或需
..
WebGL/Three.js - 移动相机时由纹理着色的粒子不规则闪烁
这是一个 jsfiddle 我把使用纹理和相机移动时. 更新:粒子上不应该有动画或运动发生.如果当您在视口上单击并拖动时，粒子完全闪烁或改变颜色，那么您就会看到问题所在.这是我在 mac OS 10.9 和 windows 7 上的 firefox 和 chrome 上测试并看到的一个问题. 粒子没有以任何方式重叠或剪裁.如果使用常规着色器对粒子进行动画处理，则不会发生闪烁.只有当粒子
..
为什么着色器必须在 webgl 程序的 html 文件中?
我看到以下问题，有人问如何从 html 中删除着色器:WebGL - 是否有替代在 HTML 中嵌入着色器的方法? 在包含问题答案中建议的着色器的文件中加载了详细的解决方法. 在我看到的教程中，着色器代码是直接嵌入到html中的.javascript 代码使用 getElementById 引用它.但是由于多种原因，将着色器直接嵌入到 html 中是很丑陋的.为什么我不能直接使用 sr
..
Three.js/WebGL:大球体在交叉点处出现破碎
让我先说我对 3D 图形非常缺乏经验. 问题 我正在使用 Three.js.我有两个球体(故意)在我的 WebGL 模型中发生碰撞.当我的球体非常大时，重叠的球体在它们相交的地方看起来“破碎"，但较小的球体呈现得非常好. 我对某些对象使用如此大的单位有一个非常具体的原因，缩小对象并不是一个真正的选择. 示例 这是更大领域的小提琴:http://jsfiddle.net
..
使用 ShaderMaterial 复制 MeshLambertMaterial 忽略纹理
我注意到 THREE.js 在内部使用着色器来创建核心材质“例如 MeshLambertMaterial"，所以我决定将 Three.js 代码中的兰伯特着色器复制到一个新的着色器中并在其上构建. 这是我得到的代码(忠实复制自 Three.js r66) THREE.MyShader = {制服:THREE.UniformsUtils.merge( [三.UniformsLib[ "com
..
如何停止 requestAnimationFrame 递归/循环?
我正在使用 Three.js 和 WebGL 渲染器来制作一个在点击 play 链接时全屏显示的游戏.对于动画，我使用 requestAnimationFrame. 我是这样发起的: self.animate = function(){self.camera.lookAt(self.scene.position);self.renderer.render(self.scene, self.
..
Three.js/WebGL - 透明平面隐藏在它们后面的其他平面
当你在 Three.js/WebGL 中有两个平面并且其中一个或两个都是透明的时，有时后面的平面会被上面的透明平面隐藏.这是为什么? 解决方案 这不是错误，它只是 OpenGL(以及 WebGL)的工作方式.透明表面不能很好地与 z 缓冲区配合使用，因此必须手动排序并从后到前渲染.三个 JS 正在尝试为您执行此操作(这就是当您将 X 值设置为 > 0 时问题消失的原因)但无法像您展示的那样
..
使用 THREE.LineBasicMaterial 的线条粗细
我正在使用下面的代码在我的 Three.js 场景中创建数百行 edgeGeometry[i] = new THREE.Geometry();edgeGeometry[i].vertices[0] = v(x1,y1,z1);edgeGeometry[i].vertices[1] = v(x2,y2,z2);edgeMat[i] = new THREE.LineBasicMaterial({颜色
..
光照模型的计算在着色器程序中是如何工作的?
我正在尝试阅读本教程: https://aerotwist.com/tutorials/an-introduction-to-shaders-part-2/ 但我无法跟进.基本上，代码通过使用直接在 GPU 上运行的着色器来创建定向光.这是代码: //与 VS 相同的名称和类型不同的 vec3 vNormal；无效主(){//计算点积并钳位//0 ->1 而不是 -1 ->1vec3
..
学习 WebGL 和three.js
我是新手，开始了解网络浏览器中的 3D 计算机图形.我对在浏览器中制作 3D 游戏很感兴趣.对于已经学习过 WebGL 和 Three.js 的任何人... 使用three.js是否需要WebGL的知识? 使用three.js 与WebGL 相比有什么优势? 解决方案 既然你有远大的抱负，你就必须花时间学习基础知识.这不是你先学什么的问题——如果你愿意，你可以同时学习它们.(这
..
用three.js动态画一条线
这就是我想要实现的(一个可修改的多边形，其中红色圆圈是顶点)并且我想动态构建多边形. 当初始化几何体时 var geometry = new THREE.Geometry();geometry.vertices.push(point);geometry.vertices.push(point);var line = new THREE.Line(geometry, new THREE.Li
..
同一页面上的多个 WebGL 模型
我的研究实验室正在开发一个网页，该网页显示一长串可滚动的 3d 模型列表，大约有 50 个左右.我们的第一个想法是使用单独的 THREE.js WebGL 上下文来做到这一点，但鉴于 WebGL 的架构，这似乎是不可取的，而且浏览器似乎将页面上的上下文数量限制为大约 2^4. 我不需要这些上下文来做任何令人印象深刻的事情:单个几何图形只有几百个三角形，没有纹理，并且一次只有一个在使用鼠标旋转
..
Android WebView 和 WebGL
Android WebView:WebGL 不适用于某些设备 我在我的 android 应用程序中使用 Webview.任务是在屏幕上添加 WebGL 交互元素.应用程序有 minSdk v21.Google 宣布他们在 WebView v36 中支持 WebGL.我使用 html5test.com 页面和我的测试网页检查 WebGL 状态. 我的测试设置:Google Nexus 6
..
为 Android WebView 启用 WebGL 支持
我需要在我的 web 视图中显示 WebGL 图形.有什么方法可以修改Android WebView 以启用WebGL.如果是，如何? 解决方案 在 Android Lollipop 之前的 WebViews 中不支持 WebGL.在 KitKat 中，Android 切换到 Chromium 作为原生 WebView 实现，但它被锁定到 Chromium 33，没有 WebGL.在 Lo
..