1

私は、バイナリ .ply ファイルの表示に関する主な機能を解決する Web サービスに取り組んでいます。点群を開いて視覚化するために、Three.js の PLYLoader を使用しています。インターネットからサンプルファイルを提示するために使用しましたが、うまくいきました。しかし、.ply ファイルを添付しようとすると、添付されません。ディスプレイを最適にする必要があるため、Three.js を使用しています。私のファイルは少なくとも 70 MB です。

.ply ファイルの例: https://onedrive.live.com/redir?resid=7DDB287362EDFD5A!761&authkey=!AOHxkZk-6etH--0&ithint=file%2cply

私が持っている .ply ファイルは、以前に表示した .ply ファイルとは少し異なることに気付きました。私のファイルには、面のみのポイントはありません。

したがって、基本的に私の質問は、「Three.js を使用して点群を表示することは可能ですか?それとも他のライブラリを使用する必要がありますか?これが可能であれば、コードが正しく機能するように構成するのを手伝ってもらえますか?

これは、.ply ファイルをサポートしているスクリプトです。

        var cameraControls;
        var container = document.getElementById("three");
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera( 75, container.offsetWidth / container.offsetHeight, 0.1, 1000 );
        var renderer = new THREE.WebGLRenderer();
        renderer.setSize( container.offsetWidth, container.offsetHeight );
        document.getElementById("three").appendChild( renderer.domElement );
        cameraControls = new THREE.OrbitControls( camera, renderer.domElement );
        cameraControls.target.set( 0, 0, 0 );
        cameraControls.addEventListener( 'change', render );
        var geometry = new THREE.BoxGeometry( 3, 3, 3 );
        var material = new THREE.MeshPhongMaterial( { color: 0x00ff00 } );
        var cube = new THREE.Mesh( geometry, material );
        var loader = new THREE.PLYLoader();
            loader.load( 'resources/cube.ply', function ( geometry ) {

                geometry.computeFaceNormals();

                var material = new THREE.MeshStandardMaterial( { color: 0x0055ff } );
                var mesh = new THREE.Mesh( geometry, material );

                mesh.position.y = - 0.25;
                mesh.rotation.x = - Math.PI / 2;
                mesh.scale.multiplyScalar( 1 );

                mesh.castShadow = true;
                mesh.receiveShadow = true;

                scene.add( mesh );

            } );
        var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
        var light = new THREE.AmbientLight( 0x404040 ); // soft white light
        scene.add( light );
        directionalLight.position.set( 0, 1, 0 );
        scene.add( directionalLight );
        camera.position.z = 5;
        function render() {
            requestAnimationFrame( render );
            renderer.render( scene, camera );
        }
        render();
4

2 に答える 2

0

を使用しTHREE.MeshNormalMaterialます。奇妙な理由でテクスチャを MeshNormalMaterial でロードします

于 2019-05-13T11:09:38.553 に答える