草庐IT

javascript - Three.js - 在 THREE.Points 上用于透明 Canvas 纹理贴图的 depthWrite 与 depthTest

问题depthWrite:false和depthTest:false之间有显着差异吗?使用depthTest是否提供性能优势?选择一个或另一个会牺牲功能吗?原始问题我想渲染一个THREE.Points对象,每个点都有半透明的圆圈。我使用了从canvas元素加载的THREE.Texture并将其传递给THREE.PointsMaterial上的map属性>.透明度没有完全起作用,一些圆圈很好地重叠,但其他圆圈表现得好像它们是实心的。我在了解了THREE.PointsMaterial上的depthWrite:false和depthTest:false后修复了它。我在哪里我有一个代码示例(嵌

javascript - 在渲染器中捕获特定网格上的点击事件

我设置了一个包含两个网格(立方体)的Canvas渲染器。我需要做的是捕捉每个立方体上的点击事件,为它调用方便的方法。到目前为止,我可以在所有渲染器上捕获点击事件,这意味着当我点击cube1和cube2时,点击属于相同的,因为它绑定(bind)到renderer:)我的问题是,如何为每个立方体绑定(bind)点击事件?我的相关代码如下://domvarcontainerPopUp=document.getElementById('popup');//renderervarrendererPopUp=newTHREE.CanvasRenderer();rendererPopUp.setSi

javascript - 如何将标签添加到 THREE.Mesh?

目标是在将鼠标悬停在网格上时将Three.Mesh名称显示为标签。我们如何在Three.js中做到这一点谁能给个示例代码? 最佳答案 接受挑战!工作代码示例位于:http://stemkoski.github.com/Three.js/Mouse-Tooltip.html这个目标似乎有三个主要步骤,每个步骤我都分解成较小的示例程序。(1)判断鼠标指向哪个场景元素。请参阅:http://stemkoski.github.com/Three.js/Mouse-Over.html(2)将要显示的文本呈现为图像(为此我使用了Canvas元素

javascript - three.js 是否有等效的背面可见性?

我有一个带有使用半透明png纹理的网格的对象。是否有MeshBasicMaterial的标志或选项,以便从前面可以看到对象的背面?下面是一些示例代码:vartexture=THREE.ImageUtils.loadTexture('world.png');//createthesphere'smaterialvarsphereMaterial=newTHREE.MeshBasicMaterial({map:texture,transparent:true,blending:THREE.AdditiveAlpha});sphereMaterial.depthTest=false;//se

javascript - 动画 GIF 作为 THREE.js 中的纹理

我正在寻找一种在THREE.js中使用GIF动画作为纹理的方法。我目前可以加载纹理(甚至是GIF格式),但它不播放动画。有什么办法吗?我找到了一些这样的链接:https://github.com/JordiRos/GLGifhttp://stemkoski.github.io/Three.js/Texture-Animation.html但我需要将GIF动画作为纹理播放,而不是在Canvas中播放。 最佳答案 您看到的不是作为纹理的动画GIF。您链接的网站使用库将GIF的每个单独帧渲染为纹理,然后通过更改纹理图像的偏移量循环浏览它们

javascript - BoxGeometry 未与 SphereGeometry 正确对齐

我正在尝试在地球上创建尖峰(球体几何)。尽管一切正常,但尖峰与地球仪不一致。我想让尖峰对齐如下图所示的东西。但是我的尖峰没有lookAt(newTHREE.Vector3(0,0,0))尽管提到了。请帮帮我。我特意提到了调试所需的代码。如果您需要更多代码,请告诉我。下图是我希望尖峰与球体对齐的方式。但这是它的样子我的主要JS初始化文件。$(document).ready(function(){//InitializingCameraInflux.Camera=newInflux.Camera({fov:60,aspectRatio:window.innerWidth/window.in

javascript - three.js - 相机变化的非常奇怪的行为

我开发了一个简单的three.js应用程序,它呈现一个立方体,并且有几个按钮来设置固定的相机位置。我在这里有我的代码演示:https://jsfiddle.net/ph0ropg7/9/在我的应用程序中,我渲染了一个立方体,我可以切换到顶View(使用TOPVIEW按钮),我可以使用SHOWALL将立方体调整到屏幕按钮。但是,我注意到三件奇怪的事情:当我平移立方体然后旋转它时,如果我按下SHOWALL按钮,当立方体调整到屏幕尺寸时相机方向会改变。当我用相应的按钮设置顶View时,控件似乎被阻止或类似的东西。如果我通过单击TOPVIEW按钮设置顶View,并在释放鼠标左键之前进行拖动,控

javascript - 在 Three.js 中加载 STL 文件的首选方法是什么

我正在编写一个旨在用作机械设计和仿真工作流程的一部分的应用程序,我们希望能够使用Three.js来加载和可视化在Solidworks中设计的零件,这可以是导出为STL(文本或二进制)。**我完全认识到可以使用Meshlab之类的工具将其转换为OBJ或其他格式,但这似乎是一个不必要的额外步骤,阻碍了工作流程。**似乎Three.js对Collada、OBJ、UTF-8、VTK和JSON有很好的加载解决方案,但没有干净的STL支持示例。我看到一些过去使用过的东西漂浮在周围,例如https://github.com/tbuser/thingiview.js/blob/master/javas

javascript - React-Three-Renderer 引用在 componentDidUpdate 中不是当前的(包括 MVCE)

我正在使用react-three-renderer(npm,github)来构建带有three.js的场景.我遇到了一个归结为MVCE的问题。引用没有按我期望的顺序更新。首先,这里是要查看的主要代码:varReact=require('react');varReact3=require('react-three-renderer');varTHREE=require('three');varReactDOM=require('react-dom');classSimpleextendsReact.Component{constructor(props,context){super(pr

javascript - THREE.JS 从 blender 中导出 JSON 模型(包括纹理)

我正在使用mrdoobBlender导出插件(io_mesh_threejs)导出到三个JS,但导出的.js或.dae对象不包含对纹理贴图文件的任何引用。我需要用特殊的方式导出对象吗?或者,是否有一种特殊的方法需要将map应用于Blender2.65中的对象,以便导出器包含它。最后,如果没有办法,我可以在JS文件中手动添加贴图吗?导出前的搅拌器导出的JSON对象(不引用纹理){"metadata":{"formatVersion":3.1,"generatedBy":"Blender2.65Exporter","vertices":8,"faces":6,"normals":8,"co