2

我现在可以很好地加载 ascii ply 文件，但是它有纹理，无论我如何配置，我似乎都无法加载它。

    cameraMain = new THREE.Camera(8, MainWidth / MainHeight, 1, 10000);
sceneMain = new THREE.Scene();
ambientLightMain = new THREE.AmbientLight(0x202020);
directionalLightMainRight = new THREE.DirectionalLight(0xffffff, 0.5);
directionalLightMainLeft = new THREE.DirectionalLight(0xffffff, 0.5);
pointLightMain = new THREE.PointLight(0xffffff, 0.3);

directionalLightMainRight.position.x = dlpx;
directionalLightMainRight.position.y = dlpy;
directionalLightMainRight.position.z = dlpz;
directionalLightMainRight.position.normalize();

directionalLightMainLeft.position.x = -dlpx;
directionalLightMainLeft.position.y = dlpy;
directionalLightMainLeft.position.z = dlpz;
directionalLightMainLeft.position.normalize();  

pointLightMain.position.x = plpx;
pointLightMain.position.y = plpy;
pointLightMain.position.z = plpz;

sceneMain.addLight(ambientLightMain);
sceneMain.addLight(directionalLightMainRight);
sceneMain.addLight(directionalLightMainLeft);
sceneMain.addLight(pointLightMain);

rendererMain = new THREE.WebGLRenderer();
texture = THREE.ImageUtils.loadTexture('3D/'+ mainURL +'.jpg', {}, function() {
    rendererMain.render(sceneMain);
});

rendererMain.domElement.style.backgroundColor = backgroundColor;
rendererMain.setSize(MainWidth, MainHeight);
rendererMain.domElement.addEventListener('DOMMouseScroll', onRendererMainScroll, false);
rendererMain.domElement.addEventListener('mousewheel', onRendererMainScroll, false);
rendererMain.domElement.addEventListener('dblclick', onRendererMainDblClick, false);
rendererMain.domElement.addEventListener('mousedown', onRendererMainMouseDown, false);

$("#viewerMain").append(rendererMain.domElement);

window.addEventListener('mousemove', onMouseMove, false);
window.addEventListener('mouseup', onMouseUp, false);

那段代码初始化模型。其中一些不需要用于问题目的，它具有用于缩放、旋转等的代码。我知道还有另一行，我已将其注释掉，但由于某种原因它不会在这里显示，所以我将单独进行。

material = new THREE.MeshBasicMaterial({map: texture});

该行位于 loadTexture 代码之后。

其余部分加载了 loadPly 函数

        var geometryMain = new THREE.Geometry();
    for (i in event.data.content[0])
      geometryMain.vertices.push(new THREE.Vertex(new THREE.Vector3(event.data.content[0][i][0], event.data.content[0][i][1], event.data.content[0][i][2])));
    for (i in event.data.content[1])
      geometryMain.faces.push(new THREE.Face3(event.data.content[1][i][0], event.data.content[1][i][1], event.data.content[1][i][2]));
    geometryMain.computeCentroids();
    geometryMain.computeFaceNormals();
    mainModel = new THREE.Mesh(geometryMain, new THREE.MeshLambertMaterial({color:0xffffff, shading:THREE.FlatShading}));
    sceneMain.addObject(mainModel);
    mainModel.overdraw = true;
    mainModel.doubleSided = true;

我尝试调整 THREE.mesh() 部分以包含材料，但它破坏了一切。我已经尝试将 map:material 添加到 MeshLambertMaterial 中，也是不行的。任何人有任何见解？对不起，如果这太复杂了，但我还远远不够了解这一点，以至于效率还不够高。

如果我添加

map:THREE.ImageUtils.loadTexture('3D/'+ mainURL +'.jpg')

到 THREE.Mesh() 行，我得到

.WebGLRenderingContext：GL 错误：GL_INVALID_OPERATION：glDrawElements：尝试访问属性 2 中超出范围的顶点

4

2 回答 2

3

为了在对象上显示纹理，它需要纹理坐标。您似乎只向几何图形添加顶点和面。查看THREE.PLYLoader来源，它似乎不支持加载纹理坐标。（虽然我不确定您是否使用该加载器，因为它应该已经返回一个就绪Geometry实例，而不是要求您手动构造数组）

于 2013-04-20T08:43:12.867 回答
1

使用 THREE.MeshNormalMaterial。当您使用 MeshNormalMaterial 时，它会显示纹理。

于 2019-05-13T10:55:29.773 回答