小编Wes*_*ley的帖子

此代码在Internet Explorer中不起作用.还有其他选择

"abcde".includes("cd")

我目前正在为网站制作一个简单的3D全景查看器.出于移动性能原因,我正在使用three.js CSS3渲染器.这需要一个立方体贴图,分成6个单个图像.

我正在使用Google Photosphere应用程序在iPhone上录制图像,或者创建2:1 equirectangular全景图像的类似应用程序.然后,我使用以下网站调整大小并将其转换为立方体贴图:http://gonchar.me/panorama/(Flash)

我希望自己做转换,无论是在three.js中,如果可能的话,还是在Photoshop中.我发现了Andrew Hazelden的Photoshop动作,它们似乎很接近,但没有直接转换.是否有一种数学方法来转换这些,或某种类型的脚本？如果可能的话,我想避免像Blender这样的3D应用程序.

也许这是一个很长的镜头,但我想我会问.我对javascript有好的经验,但我很新three.js.我也对依赖WebGL功能犹豫不决,因为它似乎在移动设备上很慢或有问题.支持也仍然参差不齐.

我使用ThreeJS在一个项目中,发现旧版本的渲染线框不同于新版本,我无法弄清楚如何恢复(我宁愿).

使用版本54的这个小提琴只渲染用线框材料绘制的对象的外边缘:http://jsfiddle.net/ksRyQ/ 或如图所示,以防这是特定于平台的(我在mac chrome上):

另一方面,当我使用较新的版本r61在本地运行相同的代码时,我会看到每个多边形的边缘,如:

两种情况下的代码都很简单:

material = new THREE.MeshBasicMaterial({
    color: 0xff0000,
    wireframe: true
});

我确信我可以用线条或其他东西制作立方体,但我宁愿真正理解这个问题.

有线索吗？有没有可以调整的设置？其次,你会注意到,现在代码正在使用画布渲染器,虽然我打算使用webGL渲染器,但两者都有相同的现象(尽管还有其他差异).

我一直致力于3D项目,我们使用Three.js Library在Web浏览器中显示3D对象.

问题是:

• 首先,模型显示在一个小的dom元素中,或者当浏览器窗口本身很小时.
• 然后,当窗口(或dom元素调整大小)时,模型变为像素化

以下是一些截图:

在调整大小之前:

调整大小后:

调整大小后应该如何:

下面是设置模型尺寸(高度和宽度)的代码部分,如果触发了resize事件,则会调用此函数:

console.log("domChanged fired")

instance.domBoundingBox = instance.dom.getBoundingClientRect();
instance.domCenterPos.x = instance.domBoundingBox.width / 2 + instance.domBoundingBox.left;
instance.domCenterPos.y = instance.domBoundingBox.height / 2 + instance.domBoundingBox.top;

var width = instance.dom.clientWidth, height = instance.dom.clientHeight;
instance.domWidthHalf = width / 2, instance.domHeightHalf = height / 2;

// TODO: fire event to expose it to site developers

// here we should update several values regarding width,height,position
if(instance.cameraReal) {
    instance.cameraReal.aspect = instance.dom.clientWidth / instance.dom.clientHeight;
    instance.cameraReal.updateProjectionMatrix();
}

if(instance.renderer3D)
    instance.renderer3D.setSize(instance.dom.clientWidth, instance.dom.clientHeight);

任何人都可以给我一个提示吗？我已经做了几天,但到目前为止还没有任何线索

我有三个模型,我在three.js创建.基于一些数据,我想创建一组由小文本标签装饰的箭头.这些标签应为2D.

看起来我有两种选择:使用单独的canvas元素来创建纹理,然后在3D模型中使用它,或者在3D模型的canvas元素上使用HTML.

我想知道如何解决这个问题.这是"正确"的方法吗？任何建议和示例代码都非常欢迎!

在three.js中,我想将一个网格添加到场景中的一个位置

我试过了:

// mesh is a THREE.Mesh
scene is a THREE.Scene
scene.add(mesh)
scene.updateMatrixWorld(true)
mesh.matrixWorld.setPosition(new THREE.Vector3(100, 100, 100))
scene.updateMatrix()

但它没有影响任何事情.

我该怎么办 ？

我正在尝试根据变量更改多维数据集的颜色.我创建了两个立方体,我想根据它们之间的距离改变颜色.

立方体的创建方式如下:

geometry = new THREE.CubeGeometry( 50, 50, 50 );
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
cube = new THREE.Mesh( geometry, material );
scene.add( cube );

现在我尝试过这样的事情:

if(distance > 20)
{
cube.material.color = 0xffffff;
}

但它不起作用.我查看了示例,但找不到合适的内容.

我理解Lambert和Phong在一般计算机图形学中的区别.我也理解如何使用three.js更改和创建自己的材料.但我无法弄清楚MeshLambertMaterial和MeshPhongMaterial在默认状态下的区别.

我试过用一个定向光源和125个球体在一个场景上切换它们,我看不出任何差异.Three.js正在我书的一章中使用,所以我需要确保所有信息都准确和准确.

谢谢,谢恩

我需要删除一个画布并构建一个新画布.我遇到了一个问题,我不知道如何停止/中断Three.js或webGL更新过程.如果我强制javascript错误,我可以阻止它(但这真的很愚蠢).

有没有人知道如何停止这个过程,以便我不会开始堆积那些没有做任何有用或与新的冲突的流程？

我确定这个问题多次重复,但我找不到任何有关我具体问题的答案!

我正在使用html5和THREE.js创建游戏,并且我有一个以'YXZ'的欧拉顺序旋转的相机.

这样摄像机就像头部一样向上,向下,向左和向右旋转.如第一人称视角.

使用此euler顺序,不使用camera.rotation中的z属性(始终为0).x用于指定以弧度表示的音高或纬度,y用于表示经度.

我有许多目标以球形方式围绕用户移动,相机始终位于该球体的中心.可以说球体的半径为1000.

我的目标是计算相机所在的位置和目标所在的位置之间的角度.

我写了这个代码来计算2个向量之间的角度:

var A = new THREE.Vector3(1,0,0);
var B = new THREE.Vector3(0,1,0);

var theta = Math.acos( A.dot(B) / A.length() / B.length() );

// theta = PI/2;

我有目标的矢量(目标[0] .position).

问题是我无法找到一种方法来获取相机所在的矢量.

我看过Vector3.applyProjection和applyEuler方法,并且玩了但仍然无法获得任何好结果.

我相信在进行任何预测之前,首先必须将欧拉订单改回'XYZ'吗？我试过了,我不知道怎么做,文档很难理解.

假如相机正好向右看,那么我需要在当前旋转方向上获得距离中心一点距离的向量.

所以我最终会得到2个向量,我可以对它进行计算!

先谢谢你!